কীভাবে টাইপস্ক্রিপ্ট সহ jQuery ব্যবহার করবেন

Question

আমি চেষ্টা করছি

$(function(){ 
    alert('Hello'); 
});

তার ভিসুয়াল স্টুডিও এই ত্রুটির দেখাচ্ছে: (TS) Cannot find name '$'.। আমি কীভাবে টাইপস্ক্রিপ্ট সহ jQuery ব্যবহার করতে পারি?

Comments

আপনি কেবল এই লাইনটি অন্তর্ভুক্ত করতে পারেনimport * as $ from "jquery";

— jcubic

Answer 1

আপনার প্রকল্পে jQuery— এর জন্য আপনার টাইপস্ক্রিপ্ট ডিক্লেয়ারেশন ফাইলটি ডাউনলোড এবং অন্তর্ভুক্ত করার সম্ভাব্য সম্ভবত jquery.d.ts।

বিকল্প 1: @ টাইপ প্যাকেজটি ইনস্টল করুন (টিএস 2.0+ এর জন্য প্রস্তাবিত)

আপনার প্যাকেজ.জসন ফাইলের মতো একই ফোল্ডারে , নিম্নলিখিত কমান্ডটি চালান:

npm install --save-dev @types/jquery

তারপরে সংকলক স্বয়ংক্রিয়ভাবে jquery এর সংজ্ঞাগুলি সমাধান করবে।

বিকল্প 2: ম্যানুয়ালি ডাউনলোড করুন (প্রস্তাবিত নয়)

এটি এখানে ডাউনলোড করুন ।

বিকল্প 3: টাইপিং ব্যবহার করে (প্রাক টিএস 2.0)

আপনি যদি টাইপগুলি ব্যবহার করছেন তবে আপনি এটি এইভাবে অন্তর্ভুক্ত করতে পারেন:

// 1. Install typings
npm install typings -g
// 2. Download jquery.d.ts (run this command in the root dir of your project)
typings install dt~jquery --global --save

---

সংজ্ঞা ফাইল সেট আপ করার পরে, $সাধারণত আপনার পছন্দ মতো এটি ব্যবহার করতে পছন্দসই টাইপস্ক্রিপ্ট ফাইলটিতে উপনাম ( ) আমদানি করুন ।

import $ from "jquery";
// or
import $ = require("jquery");

আপনার সাথে কম্পাইল করার প্রয়োজন হতে পারে --allowSyntheticDefaultImports-add "allowSyntheticDefaultImports": trueমধ্যে tsconfig.json ।

এছাড়াও প্যাকেজ ইনস্টল করবেন?

যদি আপনার জিকিউরি ইনস্টল না করা থাকে তবে আপনি সম্ভবত এটি এনএমপি এর মাধ্যমে নির্ভরতা হিসাবে ইনস্টল করতে চান (তবে এটি সর্বদা ক্ষেত্রে হয় না):

npm install --save jquery

Comments

এটি কাজ করার জন্য ভিজ্যুয়াল স্টুডিওটি পুনরায় বুট করতে হয়েছিল, ছোট পদক্ষেপটি কিন্তু আমাকে কিছুটা ছাপিয়ে গেল।

— উইলিয়াম হাওলি

@ ড্যাসলিচ এই প্রশ্নটি দেখুন

— ডেভিড শেরেট

অন্যকে সহায়তা করতে: তারপরে আপনাকে কেবল jquery ইনস্টল করতে হবে: এনপিএম jquery ইনস্টল করুন এবং এটি আমদানি সহ ব্যবহার করুন require = প্রয়োজনীয় ('jquery');

— জোনাথন

এছাড়াও ব্যবহার করতে পারেনimport * as $ from 'jquery'

— gldraphael

আমি ত্রুটি পাচ্ছিError TS1192 Module '"jquery"' has no default export.

— কার্ত্তিক

Answer 2

আমার ক্ষেত্রে আমাকে এটি করতে হয়েছিল

npm install @types/jquery --save-dev // install jquery type as dev dependency so TS can compile properly
npm install jquery --save // save jquery as a dependency

তারপর স্ক্রিপ্ট ফাইল A.ts

import * as $ from "jquery";
... jquery code ...

Answer 3

জন্য ভিসুয়াল স্টুডিও কোড

আমার জন্য কাজ করে তা হ'ল সূচি html এ <স্ক্রিপ্ট> ট্যাগের মাধ্যমে আমি স্ট্যান্ডার্ড জিকুয়ের লাইব্রেরি লোড করি make

চালান

npm install --save @types/jquery

এখন JQuery $ ফাংশনগুলি সমস্ত .ts ফাইলগুলিতে উপলব্ধ, অন্য কোনও আমদানির দরকার নেই।

Comments

আপনার কম্পোনেন্টে আপনাকে jquery / declare ঘোষণা করতে হবে, যদি এই ধরণের টাইপ চেকিংয়ের জন্য টিএসএলিন্ট চালু থাকে। উদাহরণস্বরূপ javascript declare var jquery: any; declare var $: any;

— ফিনিক্স

@ সুব্রতো, আপনার পরামর্শ ঠিক আছে কাজ করছে। এটি একটি উত্তর হিসাবে রাখুন। ধন্যবাদ।

— yW0K5o

Answer 4

আমি বিশ্বাস করি জিকুয়েরির জন্য আপনার টাইপস্ক্রিপ্ট টাইপিংয়ের প্রয়োজন হতে পারে। যেহেতু আপনি বলেছেন যে আপনি ভিজ্যুয়াল স্টুডিও ব্যবহার করছেন তাই আপনি সেগুলি পেতে নিউগেট ব্যবহার করতে পারেন।

https://www.nuget.org/packages/jquery.TypeScript.DefinitelyTyped/

নুগেট প্যাকেজ ম্যানেজার কনসোলের কমান্ডটি

Install-Package jquery.TypeScript.DefinitelyTyped

আপডেট: মন্তব্যে উল্লিখিত হিসাবে এই প্যাকেজটি ২০১ 2016 সাল থেকে আপডেট হয়নি। তবে আপনি এখনও তাদের গিথুব পৃষ্ঠাটি https://github.com/DefinitelyTypeed/DefinitelyType এ দেখতে পারেন এবং প্রকারগুলি ডাউনলোড করতে পারেন। আপনার লাইব্রেরির জন্য ফোল্ডারটি নেভিগেট করুন এবং তারপরে index.d.tsফাইলটি ডাউনলোড করুন । আপনার প্রকল্প ডিরেক্টরিতে এটি যে কোনও জায়গায় পপ করুন এবং ভিএসকে এখনই এটি ব্যবহার করা উচিত।

Comments

ডেফিনিটি টাইপসের নুগেট প্যাকেজটি আর রক্ষণাবেক্ষণ করা হয় না। আপনি যদি এটি করেন তবে আপনি একটি পুরানো সংস্করণ পাবেন।

— ডেভ ডি জং

Answer 5

কৌণিক সিএলআই ভি 7 এর জন্য

npm install jquery --save
npm install @types/jquery --save

নিশ্চিত করুন যে jquery এর কৌণিক.জসন -> স্ক্রিপ্টগুলিতে একটি প্রবেশ রয়েছে

...
    "scripts": [
        "node_modules/jquery/dist/jquery.min.js"
    ]
...

Tsconfig.app.json এ যান এবং "প্রকার" এ একটি এন্ট্রি যুক্ত করুন

{
    "extends": "../tsconfig.json",
    "compilerOptions": {
        "outDir": "../out-tsc/app",
        "types": ["jquery","bootstrap","signalr"]
    },
    "exclude": [
        "test.ts",
        "**/*.spec.ts"
    ]
}

Comments

'JQuery <HTMLElement>' টাইপ করে সম্পত্তি 'মডেল' বিদ্যমান নেই। যুক্ত হওয়ার পরে এই ত্রুটিটি

— পেয়েছে

Answer 6

2019 আপডেট করুন:

ডেভিডের উত্তর , আরও সঠিক।

টাইপসক্রিপ্ট তৃতীয় পক্ষের বিক্রেতার লাইব্রেরি সমর্থন করে, যা লাইফ্রেরি বিকাশের জন্য টাইপস্ক্রিপ্ট ব্যবহার করে না, সংজ্ঞায়িত টাইপযুক্ত রেপো ব্যবহার করে ।

---

এই ধরণের ধরণের চেকিংয়ের জন্য যদি tsLint চালু থাকে তবে আপনাকে আপনার উপাদান jquery/ ঘোষণা করার দরকার নেই $।

উদাহরণস্বরূপ

declare var jquery: any;
declare var $: any;

Comments

"যদি তাদের টাইপ ইনস্টল থাকে তবে" আমি তা পাই না। আপনি ইনস্টলড না মানে? এগুলিকে অন্যভাবে ঘোষণা করবেন কেন? আমি কেবল ত্রুটিগুলি ছাড়াই সংকলন করতে চাই এবং কোনও অতিরিক্ত স্টাফ ইনস্টল না করতে চাই এবং আমি এমন লিবসের সাথে কাজ করছি যেগুলির কোনও ধরণের ইনস্টল নেই।

— redanimalwar

@redanimalwar আমার মনে হয় আমি লিখেছিলাম যেহেতু reactjs / কৌণিকের মতো ওয়েব প্রকল্পগুলিতে, যদি ওয়েবপ্যাকটি ম্যানুয়ালি কনফিগার করা থাকে তবে তৃতীয় পক্ষের লাইব্রেরিগুলি বিশ্বব্যাপী সংজ্ঞায়িত করা হয়েছে, এবং ওয়েবপ্যাকটি বলা শক্ত যে এই লাইব্রেরিগুলি কোথা থেকে আমদানি করা হয়েছে, সুতরাং declareকীওয়ার্ড ব্যবহার করা হয়। তবে, তবুও আমরা টাইপিংগুলি সম্পর্কে vscode বলতে পারি যদি সেগুলি উপস্থিত থাকে তবে সে node_modulesকারণেই টাইপিংগুলি ইনস্টল করা ইন্টিলিসেন্সে সহায়তা করে তবে একটি ভ্যানিলা ওয়েবপ্যাক প্রকল্পের জন্য declareকীওয়ার্ড প্রকল্প ব্যতীত প্রতিস্থাপন ব্যর্থ হয়। লোকদের বিভ্রান্ত না করার জন্য আমি উত্তরটি থেকে আমার বক্তব্য সরিয়েছি।

— ফিনিক্স

যাইহোক, আমি এখন দীর্ঘকাল ধরে কৌণিক / টাইপসক্রিপ্ট দিয়ে ফিড করি নি, তবে আমার মনে হয়, যদি টাইপগুলি ইনস্টল করা থাকে তবে আমরা এরকম কিছু করতে পারতাম - import JQuery from 'jquery'; declare var $: JQuery;। নিশ্চিত না, এটি কাজ করবে কিনা।

— ফিনিক্স

আমি তৃতীয় পক্ষের ধরণের সমস্যাগুলি দমন করতে tsconfig- এ টাইপস্ক্রিপ্ট.আরং / ডকস / হ্যান্ডবুক/… ব্যবহার করে যাচ্ছি ।

— ফিনিক্স

Answer 7

আপনি যদি কোনও ওয়েব অ্যাপ্লিকেশন (উদাঃ প্রতিক্রিয়া) তে jquery ব্যবহার করতে চান এবং jquery ইতিমধ্যে লোড হয়েছে <script src="jquery-3.3.1.js"...

ওয়েবপৃষ্ঠায় আপনি এটি করতে পারেন:

npm install --save-dev @types/query
and the use it with:
let $: JQueryStatic = (window as any)["jQuery"];

সুতরাং, আপনার দ্বিতীয়বার (সাথে npm install --save jquery) জ্যাকেয়ারি লোড করার দরকার নেই তবে টাইপস্ক্রিপ্টের সমস্ত সুবিধা রয়েছে

Answer 8

এখানে আমার টাইপস্ক্রিপ্ট এবং jQuery কনফিগার পদক্ষেপ রয়েছে।

এটি ইন্টারনেটে সর্বাধিক নিবন্ধগুলির চেয়ে আরও ভালভাবে কাজ করার জন্য jQuery এর ধরণের সহায়তা করে । ( আমি বিশ্বাস করি. )

প্রথম:

npm install jquery --save
npm install @types/jquery --save-dev

দ্বিতীয় (খুব খুব গুরুত্বপূর্ণ!!):

import jquery = require("jquery");



// this helps TypeScript to understand jQuery best !!!  otherwise It will confused .
const $: JQueryStatic = jquery;

তারপরে, আপনি এটি উপভোগ করতে পারেন:

$(document).ready(function () {
    $('btn').click(function () {
       alert('I am clicked !')
    }
}

এটা রেশমি মসৃণ !!!

Comments

সুতরাং, প্রতিটি উপাদান ts ফাইল এ লিখতে হবে?

— নম্র ডল্ট

@ হাম্বলডল্ট যদি আপনি jQuery কে 【উইন্ডো】 তে আবদ্ধ করেন, আপনার কেবলমাত্র আপনার declare global { interface Window { $ :JQueryStatic; } }টাইপডেকলেশন.ড.টি.এস. এবং যথাযথভাবে বিবেচনা করার জন্য, আপনাকে 【উইন্ডো in এ মাউন্ট করা হয়েছে কিনা তা পরীক্ষা করা দরকার】যেমন import $ = require('jquery'); window.$ = $ ;, বা আপনার jQuery 【$ external বহিরাগত স্ক্রিপ্ট ট্যাগ দ্বারা মাউন্ট করা হয়েছে।

— ল্যান্সার.ইয়ান

আপনার মানে, সূচি html এ কোনও স্ক্রিপ্ট অন্তর্ভুক্ত করতে এবং সেখানে লিখতে পারেন? কৌনিক 8 এ টাইপ ডিক্লেয়ারেশন.টস? tsconfig.json আছে

— विनम्र ডল্ট

@ হাম্বলডল্ট সুতরাং, আপনি দ্বিতীয় সমাধানটি চেষ্টা করতে পারেন import $ = require('jquery') ; window.$ = $;। (আপনি আপনার প্রকল্প শুরু বিন্দুতে, এই এক init চাই। এবং আমি একটি তৈরি করতে পছন্দ sdkএকটি ফাইল বা জায়গায় সব বাইরের liberal এর সংক্ষিপ্ত রূপ প্রয়োজন প্রাথমিক পরিচালনা করতে Dir)।

— ল্যান্সার ইয়ান

@ হাম্বলডল্ট 【আপনার টাইপডেক্লেয়ারেশন.ড.টিস】 কেবল একটি টাইপ-সংজ্ঞায়িত ফাইল। এটি আপনার নিজের ধরণের সংজ্ঞায়িত করার জন্য একটি বিশেষ ফাইল। টাইপস্ক্রিপ্টে, type .d.ts হ'ল টাইপ-স্বীকৃতি এবং সত্য-কোডকে আলাদা করার জন্য কেবল একটি স্পষ্ট বিচ্ছিন্ন উপায় way আপনি কোনও ts .ts】 ফাইলে প্রকার-ঘোষণা-স্নিপেটও লিখতে পারেন, এটি এখনও কার্যকর হবে। (সম্ভবত কিছু ব্যাকরণ সংশোধন বিজ্ঞপ্তি সহ)

— ল্যান্সার

Answer 9

এটি এখন এবং আজ আমার জন্য কৌনিক সংস্করণ 9 এ কাজ করে

1. এনপিএমের মাধ্যমে এটি ইনস্টল করুন: এনএমপি আই @ প্রকার / জ্যাকোয়ারি কেবল বিশ্বব্যাপী সেটআপ করতে - সেভ যুক্ত করুন।
2. Tsconfig.app.json এ যান এবং অ্যারে "প্রকার" jquery যুক্ত করুন।
3. এনজি পরিবেশন এবং সম্পন্ন।

Answer 10

এটি আমার পক্ষে কাজ করে:

export var jQuery: any = window["jQuery"];

Comments

এটি কাজ করবে তবে দৃ strongly়ভাবে টাইপের মতো কাজ করবে না, যা টাইপস্ক্রিপ্টের সাহায্যে আপনি যদি বাহ্যিক লাইব্রেরিগুলির জন্য চান তবে চারপাশের কাজটি হারাবে। এখনও বেশ একটি আকর্ষণীয় পদ্ধতির।

— বিএনএস