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

在webstorm上配置Less

  首先,全局安装less

  npm install less -g

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

  

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

  

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

  在"Argument" 里的不用修改;

  在"Output paths to refresh"里填写解析的.css文件路径,($FileNameWithoutExtension$.css 这是解析在与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'
}

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

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

    --save-dev

    --save

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

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

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

原文:http://blog.hawkzz.com/2017/03/13/Vue-js配置less/  作者: hawk_zz

原文:http://blog.hawkzz.com/2017/03/30/安装依赖/  作者: hawk_zz

vuejs配置less的更多相关文章

  1. vuejs项目---配置理解:

    当我们需要和后台分离部署的时候,必须配置config/index.js: 用vue-cli 自动构建的目录里面  (环境变量及其基本变量的配置) 1 2 3 4 5 6 7 8 9 10 11 12 ...

  2. vuejs目录结构启动项目安装nodejs命令,api配置信息思维导图版

    vuejs目录结构启动项目安装nodejs命令,api配置信息思维导图版 vuejs技术交流QQ群:458915921 有兴趣的可以加入 vuejs 目录结构 build build.js check ...

  3. 配置vuejs加载模拟数据

    [个人笔记,非技术博客] 1.使用前确保安装axios插件,vuejs官方推荐,当然使用其他插件也可以 2.配置dev-server.js var router = express.Router(); ...

  4. No.1一步步学习vuejs 环境配置安装篇

    一 安装与配置 需要安装node.js和 nmp管理器http://nodejs.cn/安装完后测试输入命令查看版本验证 node -v //查看node.js的版本 npm -v //查看 由于有些 ...

  5. 【VueJS】VueJS开发请求本地json数据的配置

    VueJS开发请求本地json数据的配置,旧版本是build/dev-server.js,新版本是build/webpack.dev.conf.js. VueJS开发请求本地json数据的配置,早期的 ...

  6. webpack + vuejs 基本配置(一)

    开始之前 本文包含以下技术,文中尽量给与详细的描述,并且附上参考链接,读者可以深入学习: 1.webpack2.Vue.js3.npm4.nodejs —- 这个就不给连接了,因为上面的连接都是在你实 ...

  7. vueJs+webpack单页面应用--vue-router配置

    vue-route版本要跟vue版本同步,我的vue用的2.0+的,vue-router 也用了最新版2.1+ npm安装vue-router: $ npm install vue-router -- ...

  8. vuejs axios安装配置与使用

    1.安装服务 npm install --save axios vue-axios 2.在main.js import axios from 'axios' import VueAxios from ...

  9. webpack + vuejs(都是1.0的版本) 基本配置(一)

    开始之前 本文包含以下技术,文中尽量给与详细的描述,并且附上参考链接,读者可以深入学习: 1.webpack12.Vue.js13.npm4.nodejs —- 这个就不给连接了,因为上面的连接都是在 ...

随机推荐

  1. UWP appButtonBar样式

    UWP 的appButtonBar使用<AppBarButton Icon = "Next" Label = "Next" /> Icon是 Sym ...

  2. 深入浅出:JavaScript作用域链

    1. 什么是作用域 任何程序设计语言都有作用域的概念,简单的说,作用域就是变量的作用范围. 2. 变量的分类和变量作用域的分类 在JavaScript中,变量分为全局变量和局部变量,与此相对应的,变量 ...

  3. 转:C++输入一行字符串的一点小结

    原文链接: http://www.wutianqi.com/?p=1181 大家在学习C++编程时,一般在输入方面都是使用的cin.而cin是使用空白(空格,制表符和换行符)来定字符串的界的.这就导致 ...

  4. centos安装openoffice服务

    第一步:yum install openoffice.org-brand openoffice.org-core openoffice.org-java-common xvfb openoffice. ...

  5. samba服务:为在windows下操作linux的文件而生

    vi/vim编辑器好玩吗?虽有着层出不穷的语法糖但又如何与传统的sublime相媲美? 那么,来吧~ 动手跟我一起做个samba服务吧~   安装   yum -y install samba  配置 ...

  6. nexus3 添加第三方本地文件jar到仓库

    因为nexus3和nexus2手动上传第三方jar有点区别 故记录一下. 如上传京东 open-api-sdk-2.0.jar 首先创建一个目录 方便执行上传的时候url参数 也可以不创建 mkdir ...

  7. Hibernate的一对多查询及去掉重复的对象distinct

    问:sql 中 select * from A left join B on A.id=B.id where A.id=? 如果在Hibernate 中 用HQL 怎么表达呢 ?答:from A le ...

  8. sap表维护工具来维护自定义表&视图簇的使用

    一.通过表维护工具维护自定义表 1.SE11创建表 2.se11界面的菜单:实用程序->Table Maintenance Generator其实这里就是调用SE54 3.sm30 调用维护好的 ...

  9. 【NOIP2016提高组】 Day2 T1 组合数问题

    题目传送门:https://www.luogu.org/problemnew/show/P2822                 ↓题目大意↓ 数据的极限范围:n,m≤2000,k≤21,数据组数≤ ...

  10. PhiloGL学习(4)——三维对象、加载皮肤

    前言 上一篇文章中介绍了如何响应鼠标和键盘事件,本文介绍如何加载三维对象并实现给三维对象添加一个漂亮的皮肤. 一. 原理分析 我对三维的理解为:所谓三维对象无非是多个二维对象拼接到一起,贴图就更简单了 ...