如何將jquery導入到vendor.ts Angular 2 webpack

我正在嘗試基於webpack設置角度爲2的應用程序。我看到在vendor.ts中我們有這樣的結構。如何將jquery導入到vendor.ts Angular 2 webpack

// Angular 2 
import '@angular/platform-browser'; 
import '@angular/platform-browser-dynamic'; 
import '@angular/core'; 
import '@angular/common'; 
import '@angular/http'; 
import '@angular/router'; 

// RxJS 
import 'rxjs'; 


// Other vendors for example jQuery, Lodash or Bootstrap 
// You can import js, ts, css, sass, ...

我想導入jQuery（例如），但我不知道是什麼。因爲當我試圖這樣做，但它不起作用。我做錯了什麼？謝謝你的幫助。

import 'jquery/dist/jquery.min.js';

所以我不知道爲什麼rxjs進口確定，但不jQuery的:)

來源

2016-10-31 Velidan

嘗試從'jquery''導入$' –

嗨Alexey。它正在工作，但我不明白他們爲什麼導入導入'@ angular/core';在vendor.ts中，然後他們在內部模塊/組件中執行相同的操作。我應該對jQuery做同樣的事嗎？ **將jQuery **導入vendor.ts，然後在內部模塊中執行相同的操作？ – Velidan

我可能是錯的（剛剛從ng2開始），但我認爲通過在vendor.ts中導入angular/core，您可以告訴webpack將該模塊包含到生成的包中，然後在代碼中通常會導入一些特定部分像'@ angular/core'這樣的'import {NgModule}模塊;' - 這樣你就可以在你的代碼中使用'NgModule'。 –

這是我是如何實現它：

我有一個別名的resolve部分我的WebPack配置文件：

resolve: { ... alias: { jquery: "jquery/src/jquery" } }

這將允許你寫

import 'jquery';

，而不是

import 'jquery/dist/jquery.min.js';

在vendor.ts
使用的WebPack ProvidePlugin，使jQuery和$全球：

plugins: [ ... new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery', "window.jQuery": 'jquery' }), ... ]

我可能是錯的（剛開始使用NG2我自己），但我認爲，在vendor.ts進口角/核心你告訴的WebPack包括該模塊到生成的捆綁，後來在你的代碼通常會導入模塊的某些特定部分，如import { NgModule } from '@angular/core'; - 這樣您就可以在代碼中使用NgModule。

來源

2016-11-01 08:55:06

如何將jquery導入到vendor.ts Angular 2 webpack

回答

相關問題