TypeQ ile jQuery nasıl kullanılır

deniyorum

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

Onun Visual Studio bu hatayı gösteren: (TS) Cannot find name '$'.. JQuery'yi TypeScript ile nasıl kullanabilirim?

Büyük olasılıkla indirmek gerekir ve şunları typescript beyanı dosyasını jQuery için jquery.d.tsprojenize -in.

Seçenek 1: @types paketini yükleyin (TS 2.0+ için önerilir)

Package.json dosyanızla aynı klasörde aşağıdaki komutu çalıştırın:

npm install --save-dev @types/jquery

Derleyici jquery tanımlarını otomatik olarak çözecektir.

2. Seçenek: Manuel Olarak İndirin (Önerilmez)

Buradan indirin .

Seçenek 3: Tipleri Kullanma (Pre TS 2.0)

Yazıları kullanıyorsanız , bu şekilde ekleyebilirsiniz:

// 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

Tanım dosyasını ayarladıktan sonra, $normalde yaptığınız gibi kullanmak için diğer TypeScript dosyasındaki diğer adı ( ) içe aktarın .

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

--allowSyntheticDefaultImportsTsconfig.json "allowSyntheticDefaultImports": trueiçindeki —add ile derlemeniz gerekebilir .

Ayrıca Paket Yüklensin mi?

Yüklü jquery yoksa, muhtemelen npm aracılığıyla bir bağımlılık olarak yüklemek istersiniz (ancak bu her zaman böyle değildir):

npm install --save jquery

Benim durumumda bunu yapmak zorunda kaldım

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

Sonra komut dosyasında A.ts

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

Visual Studio Kodu İÇİN

Benim için işe yarar , index.html bir <script> etiketi üzerinden standart JQuery kitaplığı yükleme yapmak emin olmaktır .

Çalıştırmak

npm install --save @types/jquery

Artık JQuery $ fonksiyonları tüm .ts dosyalarında mevcuttur, başka bir içe aktarmaya gerek yoktur.

JQuery için daktilo yazımları gerekebilir inanıyorum. Visual Studio kullandığınızı söylediğinizden, onları almak için Nuget'i kullanabilirsiniz.

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

Nuget Paket Yöneticisi Konsolu'ndaki komut

Install-Package jquery.TypeScript.DefinitelyTyped

Güncelleme: Yorumda belirtildiği gibi bu paket 2016'dan beri güncellenmemiştir. Ancak yine de https://github.com/DefinitelyTyped/DefinitelyTyped adresindeki Github sayfalarını ziyaret edebilir ve türleri indirebilirsiniz. Kitaplığınızın klasörüne gidin ve index.d.tsdosyayı orada indirin. Proje dizininizin herhangi bir yerine yerleştirin ve VS hemen kullanmalıdır.

Açısal CLI V7 için

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

Jquery'nin angular.json -> komut dosyalarında bir girişi olduğundan emin olun

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

Tsconfig.app.json adresine gidin ve "türler" içine bir giriş ekleyin

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

GÜNCELLEME 2019:

Tarafından cevap David , daha doğru.

Typescript, DefinitelyTyped Repo kullanarak kitaplık geliştirme için Typescript kullanmayan 3. taraf satıcı kitaplıklarını destekler .

Bu tür Tip Kontrolleri için tsLint Açıksa, Bileşeninizde jquery/ $bileşenini bildirmeniz gerekir .

Örn.

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

Bir web uygulamasında (örn. React) jquery kullanmak istiyorsanız ve jquery zaten yüklenmişse <script src="jquery-3.3.1.js"...

Web sayfasında şunları yapabilirsiniz:

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

bu nedenle, jquery'yi ikinci kez (ile npm install --save jquery) yüklemenize gerek yoktur, ancak Typcript'in tüm avantajlarına sahip olursunuz

İşte benim TypeScript ve jQuery yapılandırma adımları.

JQuery'nin türlerini internetteki çoğu makaleden daha iyi çalışmasını destekler . ( İnanıyorum. )

ilk:

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

ikinci (çok çok çok önemli!!!):

import jquery = require("jquery");



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

o zaman, tadını çıkarabilirsiniz:

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

İpeksi pürüzsüz !!!

Bu çalışma benim için bugün ve bugün Açısal sürüm 9

1. Npm ile yükleyin: npm i @ types / jquery sadece - dünya çapında kuruluma kaydedin.
2. Tsconfig.app.json adresine gidin ve "types" jquery dizisine ekleyin.
3. hizmet ve bitti.

Bu benim için çalışıyor:

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