那些沒有導入到應(yīng)用中的舊版 JavaScript 庫可以添加到運行時的全局作用域中楼镐,并像在 script 標簽中一樣加載⊥希可以在 CLI 配置文件
angular.json
中的構(gòu)建目標(build target)的 "scripts" 和 "styles" 選項中配置 CLI框产,以便在構(gòu)建期間添加這些文件。
例如错洁,要使用 Bootstrap 4秉宿,首先就要使用 npm 包管理器來安裝該庫及其依賴:
npm install jquery --save
npm install popper.js --save
npm install bootstrap --save
或者
cnpm install jquery --save
cnpm install popper.js --save
cnpm install bootstrap --save
在 angular.json 配置文件中,把關(guān)聯(lián)的腳本文件添加到 "scripts" 數(shù)組中:
"scripts": [
"node_modules/jquery/dist/jquery.slim.js",
"node_modules/popper.js/dist/umd/popper.js",
"node_modules/bootstrap/dist/js/bootstrap.js"
],
把 Bootstrap 的 CSS 文件添加到 "styles" 數(shù)組中:
"styles": [
"node_modules/bootstrap/dist/css/bootstrap.css",
"src/styles.css"
],
運行或重啟 ng serve屯碴,看看你的應(yīng)用是否正在使用 Bootstrap 4描睦。
注意:
當你用 "scripts" 數(shù)組導入一個庫后,就不應(yīng)該在你的 TypeScript 代碼中再用 import 語句來導入它了(比如:import * as $ from 'jquery';)导而。
如果你這樣做忱叭,就會得到該庫兩個不同的副本:一個作為全局庫導入,另一個作為模塊導入嗡载。這對于那些帶有插件的庫來說特別糟糕窑多,比如JQuery,因為每個副本都會有不同的插件洼滚。