如何解決vuejs中引入css報錯問題

vuejs中引入css報錯的解決方法：1、填入解析的依賴；2、在main.js中引入外部css檔案；3、在APP.Vue裡面引入外部css檔案。

本文操作環境：windows7系統、vue2.5.17版，DELL G3電腦。

如何解決vuejs中引入css報錯問題？ VueJS引入css或less文件的一些坑 

我們在做Vue webpack的時，難免會引入各種公共css樣式文件，那麼我們改如何引入呢？引入時會有那些坑呢？

首先，在引入公共樣式時，我們在「main.js」裡使用AMD的方式引入,即

require('./assets/stylus/index.styl');
或者：
import './assets/stylus/index.styl'

這時，我們會拋出一個錯誤，是因為我們沒有寫解析的依賴，webpack不知道怎麼解析

這時，我們要填入上依賴，

import '!style-loader!css-loader! stylus-loader!./assets/stylus/index.styl'

就萬事大吉了，也可以開始引入css檔案了

---

當然，在進行上面的步驟之前，需要先安裝幾個loader==>>

npm install style-loader --save-dev
npm install css-loader --save-dev
npm install stylus-loader --save-dev

同時在webpack.base.config.js ====>>>

---

################################################################## ###這時你就可以引入css檔案了；#########另外附上幾個示意圖：######1===》在main.js中引入外部css檔案： ###############2===》在APP.Vue裡面引入外部css檔案：###### ########相關推薦：《# ##vue.js教學###》《###最新的5個vue.js影片教學精選###》###

以上是如何解決vuejs中引入css報錯問題的詳細內容。更多資訊請關注PHP中文網其他相關文章！