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 相关文章推荐
关于jquery append() html时的小问题的解决方法
Dec 16 Javascript
原生JavaScript实现连连看游戏(附源码)
Nov 05 Javascript
JavaScript实现单击下拉框选择直接跳转页面的方法
Jul 02 Javascript
JavaScript中的Function函数
Aug 27 Javascript
javascript图片切换综合实例(循环切换、顺序切换)
Jan 13 Javascript
jQuery div拖拽用法实例
Jan 14 Javascript
HTML5+jQuery实现搜索智能匹配功能
Mar 24 jQuery
bootstrap fileinput组件整合Springmvc上传图片到本地磁盘
May 11 Javascript
js+html5实现半透明遮罩层弹框效果
Aug 24 Javascript
javascript Function函数理解与实战
Dec 01 Javascript
vue实现文字横向无缝走马灯组件效果的实例代码
Apr 09 Javascript
基于Vue el-autocomplete 实现类似百度搜索框功能
Oct 25 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
php中debug_backtrace、debug_print_backtrace和匿名函数用法实例
2014/12/01 PHP
微信利用PHP创建自定义菜单的方法
2016/08/01 PHP
Symfony查询方法实例小结
2017/06/28 PHP
PHP实现的mysql读写分离操作示例
2018/05/22 PHP
使用EVAL处理jqchart jquery 折线图返回数据无效的解决办法
2015/11/26 Javascript
JavaScript-html标题滚动效果的简单实现
2016/09/08 Javascript
微信小程序 es6-promise.js封装请求与处理异步进程
2017/06/12 Javascript
JS倒计时实例_天时分秒
2017/08/22 Javascript
说说AngularJS中的$parse和$eval的用法
2017/09/14 Javascript
详解自定义ajax支持跨域组件封装
2018/02/08 Javascript
vue axios封装及API统一管理的方法
2019/04/18 Javascript
小程序异步问题之多个网络请求依次执行并依次收集请求结果
2019/05/05 Javascript
Vue表单之v-model绑定下拉列表功能
2019/05/14 Javascript
vue canvas绘制矩形并解决由clearRec带来的闪屏问题
2019/09/02 Javascript
Python实现的单向循环链表功能示例
2017/11/10 Python
Python实现发送与接收邮件的方法详解
2018/03/28 Python
Python全局变量与局部变量区别及用法分析
2018/09/03 Python
Django框架模板介绍
2019/01/15 Python
在Python 字典中一键对应多个值的实例
2019/02/03 Python
python获取栅格点和面值的实现
2020/03/10 Python
PyQt5 界面显示无响应的实现
2020/03/26 Python
Django的ListView超详细用法(含分页paginate)
2020/05/21 Python
意大利运动服减价商店:ScontoSport
2020/03/10 全球购物
宝宝周岁宴答谢词
2014/01/26 职场文书
火锅店创业计划书范文
2014/02/02 职场文书
优秀应届毕业生自荐书
2014/06/29 职场文书
医院保洁员岗位职责
2015/02/13 职场文书
大学生就业意向书
2015/05/11 职场文书
给下属加薪申请报告
2015/05/15 职场文书
Nginx tp3.2.3 404问题解决方案
2021/03/31 Servers
pytorch 如何使用batch训练lstm网络
2021/05/28 Python
SQL基础查询和LINQ集成化查询
2022/01/18 MySQL
NGINX 权限控制文件预览和下载的实现原理
2022/01/18 Servers
python 安全地删除列表元素的方法
2022/03/16 Python
Go获取两个时区的时间差
2022/04/20 Golang
MySQL数据库实验实现简单数据库应用系统设计
2022/06/21 MySQL