Angular中引用第三方庫

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

如果我們想在Angular中使用第三方的庫闲坎,比如jquery或bootstrap等钩述,該如果做呢?有兩種方法

一形帮、npm install name

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

  • –save 就是將要安裝的依賴寫到package.json的dependencies 對象中去
  • –save-dev是將要安裝的依賴寫到package.json的devDependencies 對象中去

    我們來看看package.json這個文件辩撑,package.json這個文件列出了項目所使用的第三方依賴包。
    image.png

使用npm下載的依賴包仿耽,再導入使用時合冀,用import name from '包名'

然而并不是所有的安裝包都可以使用import導入项贺,有一些舊的安裝包君躺,或者其他原因峭判,這個包沒有typescript聲明文件,沒有export棕叫,我們就不能用import 導入林螃,可以使用第二種方法

二、index.html頁面導入俺泣,或者angular.json 種配置

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

這里我簡單說一下怎么配置angular.json,頁面引入就不說了

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

我們在architect這個中可以看到styles數(shù)組和scripts數(shù)組
styles中就是我們要引入的css
scripts中就是我們要引入的js

angular.json文件

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

在angular.json 中配置了路徑后打掘,當項目啟動华畏,項目會跑到angular.json文件中根據(jù)路徑拉取文件,當路徑文件被執(zhí)行尊蚁,在全局會有一個$聲明

image.png

image.png

image.png

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

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

Angular 中引用第三庫横朋,整理總結(jié)到此為止仑乌,如有錯處,望指出琴锭,感激不盡晰甚!

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市决帖,隨后出現(xiàn)的幾起案子厕九,更是在濱河造成了極大的恐慌,老刑警劉巖地回,帶你破解...
    沈念sama閱讀 211,290評論 6 491
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件扁远,死亡現(xiàn)場離奇詭異,居然都是意外死亡刻像,警方通過查閱死者的電腦和手機畅买,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,107評論 2 385
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來细睡,“玉大人谷羞,你說我怎么就攤上這事×镝悖” “怎么了湃缎?”我有些...
    開封第一講書人閱讀 156,872評論 0 347
  • 文/不壞的土叔 我叫張陵购公,是天一觀的道長。 經(jīng)常有香客問我雁歌,道長,這世上最難降的妖魔是什么知残? 我笑而不...
    開封第一講書人閱讀 56,415評論 1 283
  • 正文 為了忘掉前任靠瞎,我火速辦了婚禮,結(jié)果婚禮上求妹,老公的妹妹穿的比我還像新娘乏盐。我一直安慰自己,他們只是感情好制恍,可當我...
    茶點故事閱讀 65,453評論 6 385
  • 文/花漫 我一把揭開白布父能。 她就那樣靜靜地躺著,像睡著了一般净神。 火紅的嫁衣襯著肌膚如雪何吝。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,784評論 1 290
  • 那天鹃唯,我揣著相機與錄音爱榕,去河邊找鬼。 笑死坡慌,一個胖子當著我的面吹牛黔酥,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播洪橘,決...
    沈念sama閱讀 38,927評論 3 406
  • 文/蒼蘭香墨 我猛地睜開眼跪者,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了熄求?” 一聲冷哼從身側(cè)響起渣玲,我...
    開封第一講書人閱讀 37,691評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎抡四,沒想到半個月后柜蜈,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,137評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡指巡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,472評論 2 326
  • 正文 我和宋清朗相戀三年淑履,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片藻雪。...
    茶點故事閱讀 38,622評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡秘噪,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出勉耀,到底是詐尸還是另有隱情指煎,我是刑警寧澤蹋偏,帶...
    沈念sama閱讀 34,289評論 4 329
  • 正文 年R本政府宣布,位于F島的核電站至壤,受9級特大地震影響威始,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜像街,卻給世界環(huán)境...
    茶點故事閱讀 39,887評論 3 312
  • 文/蒙蒙 一黎棠、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧镰绎,春花似錦脓斩、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,741評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至吗讶,卻和暖如春燎猛,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背关翎。 一陣腳步聲響...
    開封第一講書人閱讀 31,977評論 1 265
  • 我被黑心中介騙來泰國打工扛门, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人纵寝。 一個月前我還...
    沈念sama閱讀 46,316評論 2 360
  • 正文 我出身青樓论寨,卻偏偏與公主長得像,于是被迫代替她去往敵國和親爽茴。 傳聞我的和親對象是個殘疾皇子葬凳,可洞房花燭夜當晚...
    茶點故事閱讀 43,490評論 2 348

推薦閱讀更多精彩內(nèi)容

  • JavaScript 模塊化編程 網(wǎng)站越來越復雜,js代碼室奏、js文件也越來越多火焰,會遇到什么問題? 命名沖突胧沫; 文件...
    magic_pill閱讀 1,411評論 0 1
  • gulp是前端開發(fā)過程中一種基于流的代碼構(gòu)建工具昌简,是自動化項目的構(gòu)建利器;它不僅能對網(wǎng)站資源進行優(yōu)化绒怨,而且在開發(fā)過...
    西城在此閱讀 439評論 0 0
  • 本文內(nèi)容基于 npm 4.0.5 概述 npm (node package manager)纯赎,即 node 包管理...
    靜默虛空閱讀 2,116評論 0 8
  • 周末難得老公不上班,昨晚一家三口出去吃飯了南蹂,因為是周末犬金,心情不錯,正好都放松放松,吃完飯去了超市晚顷,買了一點兒子喜歡...
    李宇航媽媽閱讀 122評論 0 0
  • 世間的罪惡幾乎總是由愚昧無知造成峰伙,如果缺乏理解,好心能造成和惡意同樣大的危害该默。 ——加繆《鼠疫》
    三日青閱讀 124評論 0 1