2. css tree shaking

1.打包压缩css文件

css-loader: 加载解析文件，如遇到@import会将相应的样式文件引入（如没有css-loader则不会引入该文件）

style-loader：将解析的css放style标签，插入head标签里

(css样式打包到main.js文件里)

实例：

/* demo.css*/
body{
    background: #ccc;
}

div{
    height: 200px;
    width: 200px;
    background: tomato;
}

p{
    font-size: 50px;
    font-weight: 800;
}

a{
    color: green;
}

//index.js
import './demo.css';

//webpack.config.js
module.exports = {
    module: {
        rules: [
            {
                test: /\.css$/,
                use: ['style-loader','css-loader']
            }
        ]
    }
}

<!-- index.html -->
    <div></div>