加載css需要用到css-loader和style-loader css-loader將@import 和 url 處理成正規(guī)的ES6 import ,如果@import指向的是一個外部資源，css-loader會跳過，而只會對內部資源做處理。css-loader處理之后，style-loader會將輸出的css注入到打包文件中。css默認是inline模式，且實現了HMR接口。但inline不太適用于生產環(huán)境(全部輸出在頁面上)。還需要用extracttextplugin生成一個單獨的css文件，但先一步一步來。

一，樣式打包

1.安裝css-loader，style-loader

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

2.修改webpack.config.js

增加一個一級子節(jié)點

電腦培訓,計算機培訓,平面設計培訓,網頁設計培訓,美工培訓,Web培訓,Web前端開發(fā)培訓

  module:{
       rules:[{
       test:/\.css$/,
       use: ['style-loader', 'css-loader'],
     }]
    },

電腦培訓,計算機培訓,平面設計培訓,網頁設計培訓,美工培訓,Web培訓,Web前端開發(fā)培訓

test的正則會匹配.css的文件。use中的執(zhí)行順序是從右到左。loader的執(zhí)行是連續(xù)的，就像管道一樣，先