vue.js之vue-cli中使用less

vue.js之vue-cli中使用less
1.首先,安装 less 和 less-loader ,在项目目录下运行如下命令

npm install less less-loader --save-dev

2.在配置文件build/webpack.config.js中添加如下代码

 module: {
     rules: [
       ...
       //前面会有一些规则,加载最后面
       {
         test: /\.less$/,
         loader: "style-loader!css-loader!less-loader",
       }
     ]
  },

3.在页面中添加


注意:更改配置文件后,运行项目时会报错,找不到某些包,要使用 npm install 重新安装一下,如果还会出错,就用 npm uninstall *** 卸载该包重新下载。如果不行就多试几次。

你可能感兴趣的:(vue.js之vue-cli中使用less)