webpack.config.js中的css样式、sass、打包抽离，浏览器加前缀（兼容），图片文件处理，ES6处理

webpack.config.js中的css样式、sass、打包抽离，浏览器加前缀（兼容），图片文件处理，ES6处理

1.安装css和style插件

yarn add style-loader css-loader

index.css

body{
    background:skyblue;
}

将样式引入js文件

//引入样式
require('./index.css')

console.log(2+2)

在webpack.config.js中配置文件
module.exports内添加：

	module: {
        rules: [
            {
            test: /\.css$/i,    //匹配找到任何以css为后缀的文件（匹配）
            use: ['style-loader', 'css-loader'],    //从后往前的顺序，先将css解析，而后再将其放入style标签里去(use:用xxx)
            },
        ],
    },

2.安装解析sass插件

yarn add sass-loader node-sass

index.scss:

$bg-color:greenyellow;
body{
    background:$bg-color;
}