1.安装
1.1 less包: npm install -g less
1.2 less-loader : npm install --save less less-loader
2. vue 引用
main.js 中
import Less from 'less'
Vue.use(Less)
3.爬坑
3.1需要在build/webpack.base.conf.js中加入代码
{
test: /\.less$/,
loader: ["vue-loader", "css-loader", "less-loader"]
},
{
test: /\.less$/,
loader: 'vue-loader',
options: vueLoaderConfig
}
3.2 “You may need an appropriate loader to handle this file type”有这个便是less-loader没有安装好
3.2.1在执行npm install --save less less-loader时 注意日志会出现报错信息,并弹出xcode安装 更新命令行工具 安装xcode 并安装command line tool
使用如下命令行安装CommandLineTools
1.删除已经安装的CommandLineTools
$ sudo rm -rf $(xcode-select -p)
2.重新安装
$ sudo xcode-select --install
3.完成上面的步骤 getpotoions.js 如果发现less还是会在页面内报错,可能是less-loader的版本问题,可使用下面的命令安装指定的less-loader的版本
npm uninstall less-loader
npm cache clear -f
npm i less-loader@4.1.0