css loader的安装

css loader

1.通过require的方式来引入css，我们来看具体的方法，首先需要安装css-loader，

style-loader(安装style-loader的目的是为了在html中以style的方式嵌入css)。

cnpm install css-loader --save-dev

cnpm install style-loader --save-dev

 

webpack.config.js中

module: {

loaders:[

{ test: /\.css$/, loader: 'style-loader!css-loader' }

]

},

探测到.css文件时则使用css-loader和style-loader

》index.css中引入require('./index.css');

3.在webpack打包之后是把样式文件打包进了index.js文件中

 

 

这将会导致网页加载过程中js加载造成的网页空白，--加载慢

1）cnpm install --save-dev extract-text-webpack-plugin@2.1.2

https://www.jianshu.com/p/439764e3eff2

（1）***css分离打包设置

var Ex = require('extract-text-webpack-plugin');/

（2）***webpack的 plugins 里面设置抽离出来的CSS文件名叫什么。

new Ex("css/[name].css")

（3）设置loader

loader: Ex.extract({

fallback:'style-loader',

use: "css-loader"

})