vue cli安装使用less的教程详解


Posted in Javascript onJuly 12, 2019

vue-cli构建的项目默认是不支持less的,需要自己添加依赖

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

npm install less less-loader --save-dev

vue cli安装使用less的教程详解

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

module.exports = {

// 此处省略无数行,已有的的其他的内容
module: {
  rules: [
   // 此处省略无数行,已有的的其他的规则
   {
    test: /\.less$/,
    loader: "style-loader!css-loader!less-loader",
   }
  ]
 }
}

vue cli安装使用less的教程详解

3.最后,在代码中的style标签中加上lang="less"属性即可

<style lang="less" scoped>
 .index-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  span {
   font-size: 0.373rem;
  }
 }
</style>

总结

以上所述是小编给大家介绍的vue cli安装使用less的教程详解 ,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
jQuery实现按键盘方向键翻页特效
Mar 18 Javascript
jQuery带时间的日期控件代码分享
Aug 26 Javascript
一道JS前端闭包面试题解析
Dec 25 Javascript
js html css实现复选框全选与反选
Oct 09 Javascript
Jquery EasyUI Datagrid右键菜单实现方法
Dec 30 Javascript
vue2.0嵌套路由实现豆瓣电影分页功能(附demo)
Mar 13 Javascript
JS操作时间 - UNIX时间戳的简单介绍(必看篇)
Aug 16 Javascript
jQuery动态添加.active 实现导航效果代码思路详解
Aug 29 jQuery
vue axios请求频繁时取消上一次请求的方法
Nov 10 Javascript
JavaScript常见事件处理程序实例总结
Jan 05 Javascript
Vue运用transition实现过渡动画
May 06 Javascript
解决vue初始化项目一直停在downloading template的问题
Nov 09 Javascript
Js通过AES加密后PHP用Openssl解密的方法
Jul 12 #Javascript
django js 实现表格动态标序号的实例代码
Jul 12 #Javascript
JavaScript中的连续赋值问题实例分析
Jul 12 #Javascript
微信小程序开发常见问题及解决方案
Jul 11 #Javascript
使用vue for时为什么要key【推荐】
Jul 11 #Javascript
利用Angular7开发一个Radio组件的全过程
Jul 11 #Javascript
vue发送websocket请求和http post请求的实例代码
Jul 11 #Javascript
You might like
PHP4之真OO
2006/10/09 PHP
对比分析php中Cookie与Session的异同
2016/02/19 PHP
php基于ob_start(ob_gzhandler)实现网页压缩功能的方法
2017/02/18 PHP
PHP判断json格式是否正确的实现代码
2017/09/20 PHP
PHP获取星期几的常用方法小结
2018/12/18 PHP
PHP实现提高SESSION响应速度的几种方法详解
2019/08/09 PHP
Yii框架函数简单用法分析
2019/09/09 PHP
禁止直接访问php文件代码分享
2020/05/05 PHP
一行代码告别document.getElementById
2012/06/01 Javascript
通过复制Table生成word和excel的javascript代码
2014/01/20 Javascript
jQuery标签编辑插件Tagit使用指南
2015/04/21 Javascript
Bootstrap3 多选和单选框(checkbox)
2016/12/29 Javascript
js常用的继承--组合式继承
2017/03/06 Javascript
jQuery设计思想
2017/03/07 Javascript
Javascript实现页面滚动时导航智能定位
2017/05/06 Javascript
javascript 中iframe高度自适应(同域)实例详解
2017/05/16 Javascript
基于VUE选择上传图片并页面显示(图片可删除)
2017/05/25 Javascript
javascript字体颜色控件的开发 JS实现字体控制
2017/11/27 Javascript
vue-cli3.0 脚手架搭建项目的过程详解
2018/10/19 Javascript
JavaScript实现拖拽盒子效果
2020/02/06 Javascript
[03:17]DOTA2英雄基础教程 剧毒术士
2013/12/12 DOTA
python验证码识别实例代码
2018/02/03 Python
python 从文件夹抽取图片另存的方法
2018/12/04 Python
VSCode Python开发环境配置的详细步骤
2019/02/22 Python
python实践项目之监控当前联网状态详情
2019/05/23 Python
python实现Dijkstra算法的最短路径问题
2019/06/21 Python
win10下安装Anaconda的教程(python环境+jupyter_notebook)
2019/10/23 Python
Python垃圾回收机制三种实现方法
2020/04/27 Python
一款css实现的鼠标经过按钮的特效
2014/09/11 HTML / CSS
英国Boots旗下太阳镜网站:Boots Designer Sunglasses
2018/07/07 全球购物
含精油的天然有机化妆品:Indemne
2019/08/27 全球购物
房地产还款计划书
2014/01/10 职场文书
领导干部查摆“四风”问题自我剖析材料思想汇报
2014/10/05 职场文书
党的群众路线剖析材料
2014/10/09 职场文书
水电施工员岗位职责
2015/04/11 职场文书
青年干部培训班学习心得体会
2016/01/06 职场文书