Webpack 处理css资源
首先需要安装 css-loader
npm install --save-dev css-loader
npm i style-loader -D
引入样式
import css from "file.css"
webpack.config.js
module.exports = {
//加载器
module:{
rules:[
test:/\.css$/, //只检测.css文件
use:[ //执行顺序,从右往左(从下到上)
"style-loader", //将js中css通过创建style标签添加html文件中生效
"css-loader" //将css资源编译成commonjs的模块到js中
]
],
},
}
处理less资源(sass和less差不多)
npm install less less-loader --save-dev
module.exports = {
//加载器
module:{
rules:[
test:/\.less$/,
//loader:'', //只能使用一个loader
use:[ //可以使用多个loader
"style-loader",
"css-loader",
"less-loader" //将less编译成css文件
]
],
},
}