使用angular-cli構建angular2項目時遇到的問題及解決方案

1.在項目中想使用第三方的庫(比如jquery等)

場景說明,項目需要使用juqery的一個標籤雲插件
這裏寫圖片描述

想要使用這個插件需要引入jquery以及這個插件的一個js文件

解決流程

1.配置package.json添加新的依賴,然後進行update,下載新的庫
這裏寫圖片描述

另外一個插件的js文件在npm中找不到,直接將下載好的js文件放到assets文件中
這裏寫圖片描述

2.配置angular-cli.json文件
這裏寫圖片描述

另外需要注意的是,在需要使用jquery的組件中,需要聲明$變量,如果你使用jquery那麼聲明jquery變量(declare var jquery: any;),如果不聲明的話會報錯:
這裏寫圖片描述

2.部署時遇到的問題

在項目中我需要用到angular material,我按照material的文檔要求
這裏寫圖片描述

在index.html中引入indigo-pink.css
這裏寫圖片描述

可是當部署到服務器時會出現找不到indigo-pink.css的錯誤

原因:
ng build完之後你會發現dist文件夾裏面只有這些文件
這裏寫圖片描述

當你把build好的文件部署到服務器時,自然就找不到在node_modules中的indigo-pink.css文件了

可是,你會發現build好的dist文件夾中有一個assets文件夾,所以

解決方案:

將indigo-pink.css放到assets中
這裏寫圖片描述

隨後修改index.html:
這裏寫圖片描述

問題解決!

若博客中有錯誤的地方請指正,謝謝!