vue2: p16 webpack添加css样式处理,less样式处理

1.安装

npm i style-loader css-loader -D

2.配置webpack.config.js，加一项

module:{
rules:[
//style-loader,css-loader顺序有先后，不能乱写
{test:/\.css$/,use:['style-loader','css-loader']}
]
}

3.src/index.js内引入css样式

import './index.css'

最后重启项目：npm run dev

二less样式处理

1.安装

npm i less-loader less -D

2.配置在webpack.config.js的module.rules中添加一条

//less不用添加，它是less-loader的内置依赖
{test:/\.less$/,use:'style-loader','css-loader','less-loader'}

3.index.js中引入index.less

import './index.less'

index.less

@wid:150px;
@hei:@wid - 10px;
ul>li{
width:@wid;
height:@hei;
}

重启npm run dev