鍍金池/ 問(wèn)答/PHP  HTML/ vue引入css靜態(tài)資源報(bào)錯(cuò)

vue引入css靜態(tài)資源報(bào)錯(cuò)

用vue腳手架搭建了項(xiàng)目： vue init webpack my-app

之后想引入css文件
結(jié)構(gòu)目錄
clipboard.png

main.js中import引入

clipboard.png

但是啟動(dòng)服務(wù)之后，報(bào)錯(cuò)（如下圖）

clipboard.png

這是什么原因呢

回答
編輯回答
北城荒

在webpack配置文件的rules數(shù)組中添加打包字體文件的loader,記得npm install --save -D url-loader,如下：

{

    test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
    loader: 'url-loader',
    options: {
      limit: 10000,
      name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
    }
  }
2017年2月9日 01:26
編輯回答
奧特蛋

沒(méi)有裝css-loader

2017年1月19日 21:02
編輯回答
玄鳥(niǎo)

謝謝 @廈冰 @hylwz @Tauren 的回復(fù)，經(jīng)過(guò)各種的配置和測(cè)試，發(fā)現(xiàn)默認(rèn)之前配置的淘寶 鏡像好像有些是需要手動(dòng)安裝的，之后我取消了淘寶鏡像的配置，重新搭建了項(xiàng)目，現(xiàn)在的做法是 npm install bootatrap --save 安裝了bootastrap的依賴(lài)，在main.js中直接import 'bootstrap/dist/css/bootstrap.min.css' 這樣是都是可以運(yùn)行的，也不會(huì)報(bào)錯(cuò)了

2017年9月28日 18:13
編輯回答
安若晴

還缺少字體文件，要把字體文件也下載下來(lái)，放到font目錄，同時(shí)配置loader

2018年1月13日 12:48