【webpack】webpack解析css的loader与配置

作用

• 由于webpack啥都没配时候是只认js不认css的，所以需要loader进行转换

使用

• 先在src下建一个index.js和index.css
• css文件下写body的backguround给个颜色，index.js中直接引入import '.\index.css'
• 注意：
• loader的执行顺序默认从下往上，从右往左。
• cssloader会解析css语法，styleloader会把解析出来的css变成style标签插入页面中。
• 安装：npm i css-loader style-loader -D
• 配置：

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

• 注意顺序不能错
• 进行测试，打包后样式存在即成功。