有些庫有typescript聲明文件，有export就可以用import導(dǎo)入，沒有的話可以使用頁面引入的方式或者angular.json文件配置的方式配合declear const name的方式使用

如果我們想在Angular中使用第三方的庫，比如jquery或bootstrap等，該如果做呢？有兩種方法

一、npm install name

通過npm install ${name} --save 安裝在node_modules目錄下，package.json中的dependencies會(huì)配置正式環(huán)境所依賴的庫。

• –save 就是將要安裝的依賴寫到package.json的dependencies 對(duì)象中去

• –save-dev是將要安裝的依賴寫到package.json的devDependencies 對(duì)象中去
  

  我們來看看package.json這個(gè)文件，package.json這個(gè)文件列出了項(xiàng)目所使用的第三方依賴包。
  image.png

使用npm下載的依賴包，再導(dǎo)入使用時(shí)，用import name from '包名'，

然而并不是所有的安裝包都可以使用import導(dǎo)入，有一些舊的安裝包，或者其他原因，這個(gè)包沒有typescript聲明文件，沒有export，我們就不能用import 導(dǎo)入，可以使用第二種方法

二、index.html頁面導(dǎo)入，或者angular.json 種配置

在頁面直接引用和在angular.json 配置路徑?jīng)]有什么區(qū)別，都是項(xiàng)目啟動(dòng)，根據(jù)路徑拉去到對(duì)應(yīng)的JS文件并執(zhí)行，然后在全局產(chǎn)生了一個(gè)聲明，然后在項(xiàng)目種使用declare const 聲明可以找到

這里我簡(jiǎn)單說一下怎么配置angular.json，頁面引入就不說了

angular.json這個(gè)文件是 Angular命令行工具的配置文件。引一些其他的第三方的包 比如jquery等，那么現(xiàn)在我們就需要去修改angular.json這個(gè)文件。

我們?cè)赼rchitect這個(gè)中可以看到styles數(shù)組和scripts數(shù)組
styles中就是我們要引入的css
scripts中就是我們要引入的js

angular.json文件

ng4+的新版已經(jīng)不需要類型描述文件了

在angular.json 中配置了路徑后，當(dāng)項(xiàng)目啟動(dòng)，項(xiàng)目會(huì)跑到angular.json文件中根據(jù)路徑拉取文件，當(dāng)路徑文件被執(zhí)行，在全局會(huì)有一個(gè)$聲明

image.png

image.png

image.png

這個(gè)時(shí)候已經(jīng)可以使用JQ了

其他第三方庫也是類似，主要分為兩種，有無typescript聲明文件

Angular 中引用第三庫，整理總結(jié)到此為止，如有錯(cuò)處，望指出，感激不盡！