13 复习 - webpack基本配置2

Posted 2020-11-22 songsong_p_blue

在webpack下使用样式表
1.安装处理样式表的loader

cnpm i style-loader css-loader -D   //css
cnpm i less-loader less -D          //less
cnpm i sass-loader node-sass -D     //scss

2.添加配置节点
配置文件webpack.config.js下
和plugins平级

module:{//配置所有第三方loader模块的
    rules:[//第三方模块的匹配规则
    {test:/.css$/,use:['style-loader','css-loader']},//处理css文件的loader
    {test:/.less$/,use:['style-loader','css-loader','less-loader']},//处理less文件的loader
    {test:/.scs$/,use:['style-loader','css-loader','sass-loader']},//处理scss文件的loader
    ]
}