vue-cli 构建的项目中使用 Less

vue-cli 构建的项目中使用 Less

less和sass算是一种趋势,不仅仅是在vue项目中,就像是代码,重复的东西大家都不想写,于是就预设了一个变量,至于我为什么用less而不是sass,因为第一次vue安装sass没成功而less成功了,这也算是第一印象吧。

1,安装 less 和 less-loader ,在项目目录下运行如下命令

也许是以前,反正大多用less都说要来走一下第2步,我以前也深信不疑,然而有一次蛇皮操作忘了加这段代码less却能用,后来发现居然没加这一段,这就尴尬了。

2,安装成功后,打开 build/webpack.base.conf.js ,在 module.exports = 的对象的 module.rules 后面添加一段:

全局搜一下less,你就会发现vue-cli在build/utils里面已经配置过了;

3,在代码中的 style 标签中 加上 lang=”less” 属性即可。

4,最后如果我们想用全局的less,可以在main.js中自定义一个,不想用也无所谓。

发表评论

电子邮件地址不会被公开。