vuejs如何配置less


Posted in Javascript onApril 25, 2017

本次我们来聊聊,vuejs里如何使用less。都是根据自己的开发经验来写,不对的地方请各位拍砖。

在webstorm上配置Less

首先,全局安装less

npm install less -g

然后,在webstorm上配置less插件,"File" --> "settings"-->"Tools"

vuejs如何配置less

在"file Watchers" -->"+"-->"Less"

vuejs如何配置less

在"Program"里填写less的安装路径;

在"Argument" 里的不用修改;

在"Output paths to refresh"里填写解析的.css文件路径,($FileNameWithoutExtension$.css 这是解析在与less同一路径目录下);

vuejs如何配置less

Vue项目配置Less

首先,安装less依赖:"less" 与 "less-loader";

npm install less less-loader --save(这里最好是写成--save)

接着,配置webapck解析,"bulid"-->"webpack.base.config.js",添加一下代码

{
   test: /\.less$/,
   loader: 'style-loader!css-loader!less-loader'
 }

vuejs如何配置less

 简说安装依赖是"--save"和"--save dev"的区别

我们在使用npm install 安装模块或插件的时候,有两种命令把他们写入到 package.json 文件里面去,比如:

--save-dev

--save

在 package.json 文件里面提现出来的区别就是,使用 --save-dev 安装的 插件,被写入到 devDependencies 对象里面去,而使用 --save 安装的插件,则被写入到 dependencies 对象里面去。

那 package.json 文件里面的 devDependencies  和 dependencies 对象有什么区别呢?

devDependencies  里面的插件只用于开发环境,不用于生产环境,而 dependencies  是需要发布到生产环境的。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
判断是否输入完毕再激活提交按钮
Jun 26 Javascript
设置下载不需要倒计时cookie(倒计时代码)
Nov 19 Javascript
jQuery Select(单选) 模拟插件 V1.3.62 改进版
Jul 17 Javascript
Javascript连接多个数组不用concat来解决
Mar 24 Javascript
AngularJS入门教程(二):AngularJS模板
Dec 06 Javascript
js根据手机客户端浏览器类型,判断跳转官网/手机网站多个实例代码
Apr 30 Javascript
关于JavaScript限制字数的输入框的那些事
Aug 14 Javascript
AngularJS中比较两个数组是否相同
Aug 24 Javascript
gulp-uglify 与gulp.watch()配合使用时报错(重复压缩问题)
Aug 24 Javascript
AngularJS实现自定义指令及指令配置项的方法
Nov 20 Javascript
vue实现点击展开点击收起效果
Apr 27 Javascript
原生js实现日历效果
Mar 02 Javascript
微信小程序访问node.js接口服务器搭建教程
Apr 25 #Javascript
微信小程序中显示html格式内容的方法
Apr 25 #Javascript
详谈Angular 2+ 的表单(一)之模板驱动型表单
Apr 25 #Javascript
详解Vue 动态添加模板的几种方法
Apr 25 #Javascript
详解vue-cli + webpack 多页面实例应用
Apr 25 #Javascript
基于Vue实现timepicker
Apr 25 #Javascript
VueJS如何引入css或者less文件的一些坑
Apr 25 #Javascript
You might like
实用函数3
2007/11/08 PHP
ThinkPHP处理Ajax返回的方法
2014/11/22 PHP
PHP 双链表(SplDoublyLinkedList)简介和使用实例
2015/05/12 PHP
php获取网站百度快照日期的方法
2015/07/29 PHP
php利用smtp类实现电子邮件发送
2015/10/30 PHP
PHP连接SQL server数据库测试脚本运行实例
2020/08/24 PHP
javascript prototype,executing,context,closure
2008/12/24 Javascript
JQuery中关于jquery.js与jquery.min.js的比较探讨
2013/05/15 Javascript
js判断两个日期是否相等的方法
2013/09/10 Javascript
Jquery ui datepicker设置日期范围,如只能隔3天【实现代码】
2016/05/04 Javascript
微信小程序 JS动态修改样式的实现代码
2017/02/10 Javascript
NodeJs通过async/await处理异步的方法
2017/10/09 NodeJs
浅谈webpack下的AOP式无侵入注入
2017/11/12 Javascript
layui的面包屑或者表单不显示的解决方法
2019/09/05 Javascript
js实现纯前端压缩图片
2020/11/16 Javascript
基于Python实现的扫雷游戏实例代码
2014/08/01 Python
解决Python出现_warn_unsafe_extraction问题的方法
2016/03/24 Python
Django ORM 聚合查询和分组查询实现详解
2019/08/09 Python
开启Django博客的RSS功能的实现方法
2020/02/17 Python
Python+Kepler.gl轻松制作酷炫路径动画的实现示例
2020/06/02 Python
python 下划线的不同用法
2020/10/24 Python
python脚本定时发送邮件
2020/12/22 Python
Python 中如何使用 virtualenv 管理虚拟环境
2021/01/21 Python
Julep官网:美容产品和指甲油
2017/02/25 全球购物
描述JSP和Servlet的区别、共同点、各自应用的范围
2012/10/02 面试题
安全生产中长期规划实施方案
2014/02/21 职场文书
关于爱国的演讲稿
2014/05/07 职场文书
校园元旦活动总结
2014/07/09 职场文书
2014副局长群众路线对照检查材料思想汇报
2014/09/22 职场文书
2015年房产销售工作总结范文
2015/05/22 职场文书
电影建国大业观后感
2015/06/01 职场文书
余世维讲座观后感
2015/06/11 职场文书
学雷锋感言
2015/08/03 职场文书
靠谱的活动总结
2019/04/16 职场文书
Python 中的单分派泛函数你真的了解吗
2021/06/22 Python
Apache Pulsar结合Hudi构建Lakehouse方案分析
2022/03/31 Servers