Как импортировать $ из jQuery.min.js в приложение Angular 2? имя не найдено

Question

У меня есть приложение Angular 2, использующее TypScript. Я хочу использовать JQuery-х $ для различных задач, таких как

$(document).ready(function(){  // throwing error: "[ts] Cannot find '$'. any" 
    console.log("loaded up!"); 
    $("#main_div").niceScroll(); 
}) 

Я импортированы jQuery.min.js файл в мое приложение через index.html так:

<script src="app/libs/jquery.min.js"></script> 

Однако я ничего не импортировали в файл app.component.ts в отношении кода jQuery. Нужно ли, и если да, то как его импортировать?

import { GenericService } from './services/Generic.service';  // did not do this 
import $ from './libs/jquery.min.js';        // tried this but does not work 

Удивительно, но мой код работал вчера, как я разрабатывал, но не сегодня, когда я побежал npm start. Может ли кто-нибудь помочь мне в этом процессе импорта?

Answer 1

Просто сделать

typings install jquery --ambient --save 

установить файл определения типа. Удалите import $ from './libs/jquery.min.js'; и добавить ссылку на файл d.ts в верхней части вашей app.component.ts так:

/// <reference path="../typings/jquery.d.ts"/> 

Поскольку вы уже загрузив файл Javascript в вашем индексе вам нужно только типизации для него, так машинопись знает , что эти имена и методы jQuery существуют.

Answer 2

Просто добавьте Jquery с типизации:

typings install jquery --ambient --save 

Тогда в индексе:

<script src="bower_components/jquery/dist/jquery.min.js"></script> 

И обычно машинопись будет делать работу :)