1. 去node的主页下载对应版本的nodejs然后安装下载地址:http://nodejs.org/   根据自己的系统选择合适的版本下载。
  2. 安装完成之后打开命令提示符(win+r 输入cmd 回车),分别输入node -v以及npm -v如果返回版本号说明你安装成功了
  3. 接下来就可以安装less了,在“命令提示符”下运行命令“npm install less -g”,然后npm就自动开始下载并安装LESS。
  4.   配置webstorm(版本10),点击“文件”> "设置"(Ctrl+Alt+S) 弹出设置界面,在左侧导航找到“工具(tool)">"file Watchers" 点击“+”号按钮找到less文件选项点击添加。
  5. 配置参数
    1. Arguments : --no-color --source-map=$FileNameWithoutExtension$.css.map $FileName$
    2. Output paths to refresh : $FileNameWithoutExtension$.css:$FileNameWithoutExtension$.css.map
    3. 配置完参数后,写完less代码后,会直接在less文件的目录下生成一个.css文件和一个.css.map文件
    4. .css.map文件的作用是可以直观的在浏览器调试界面看到的是less文件的第几行
      1. 因为你是用less写的样式,less会编译成css显示在页面上。
      2. 但有个麻烦,浏览器里看的都是css第几排,而你编辑的又是less文件,很难对上。
      3. 这个时候有了source map,浏览器里直接显示less,非常方便。

webstoem自动编译less文件的更多相关文章

  1. Eclipse不自动编译java文件的终极解决方案

    最近我的eclipse经常犯傻,项目中总是有很多,启动项目也是没有启动类.查了下项目中生成的class文件,我靠竟然没有,或者还是以前的.原来是eclipse犯傻了,它没帮我自动编译java文件.一般 ...

  2. Eclipse不能自动编译 java文件的解决方案

    前段时间出现了eclipse 不自动编译java文件的问题,在网上找了好长时间,总算把问题解决了,现在把这个问题的解决方法总结一下. 1,看看project -- Build Automaticall ...

  3. Eclipse不能自动编译 java文件

      在网上的解决方法 方法参考如下: (1) Window-->Preferences-->General-->Workspace  有个"Build automatica ...

  4. Eclipse不能自动编译 java文件,不会生成CLASS

    每次修改类代码后都得重启 Tomcat 花了1天终于解决,网上所说基本是下面1和2的方法,使用之后还是不行最后重新建工作环境导入项目对比了一下找到第三种方法 1.Project 下有个 "B ...

  5. Tomcat不能自动编译JSP文件问题的一种解决方法

    今天碰到一个非常奇怪的问题,机器环境是JDK8.Tomcat8,把jQuery MiniUI ( for Java Eclipse)下载后导入到Eclipse中,首页可以显示,但运行操作数据库的页面出 ...

  6. 安利一个MVC的好东西,RazorGenerator.MsBuild,可以自动编译cshtml文件

    在传统的asp.net webForm 开发里,在发布时,如果选择预编译,就会自动将所有的aspx 文件编译,在发布后的目录里,就看不到aspx的源代码了,同时因为是预编译的,所以每个页面打开速度都挺 ...

  7. 利用babel自动编译es6文件

    一.检查File-Watchers中Babel的Arguments,有一项presets的设置,把他更改为=es2015,详细设置如下: $FilePathRelativeToProjectRoot$ ...

  8. WebStorm怎么设置实现自动编译less文件

    首先,需要保证电脑安装过Node.js,下载地址:https://nodejs.org/en/ 安装Node.js的时候会自动安装npm 然后,安装lessc模块 打开cmd控制台 输入下面一行npm ...

  9. Grunt 自动编译 Less 文件配置

    1.安装Grunt http://www.gruntjs.net/getting-started 2.编辑 package.json 文件 { "name": "Grun ...

随机推荐

  1. Scala文件操作

    Scala中的文件操作基本可以依赖于Java的实现,包括输入.输出流的使用. object FileOps {def main(args: Array[String]) { val file = So ...

  2. Php函数完整参考手册

    序号 分类 描述 1 Array 函数 2 Calendar 函数 日历扩展包含了简化不同日历格式间的转换的函数. 3 Date/Time 函数 Date/Time 函数用于从 PHP 脚本运行的服务 ...

  3. TDD(测试驱动开发)的推广方法论

  4. iherb账户

    LMJ997 23622335@qq.com yjxwly***** LUR472 13821660226@163.com linda**** LFW887 bella****

  5. C#中值类型与引用类型通俗理解

    关于值类型和引用类型已经有很多人写了很多文章,但是很多人也只是停留在字面上的理解,如果采用一种通俗的方法来解释,想必很多人都会理解.我们都知道值类型存储在栈上,引用类型存储在堆上,引用类型都是xxx类 ...

  6. C#使用SqlDataAdapter 实现数据的批量插入和更新

    近日由于项目要求在需要实现中型数据的批量插入和更新,晚上无聊,在网上看到看到这样的一个实现方法,特摘抄过来,以便以后可能用到参考. 一.数据的插入 DateTime begin = DateTime. ...

  7. 调试技术(/proc、/sys、/dev、strace)

    一.在/proc中实现文件 当某个进程读取我们的/proc文件时,内核会分配一个内存页,即PAGE_SIZE字节的内存块.驱动程序可以将数据通过这个内存页返回到用户空间. 第一种方法,不采用seq_f ...

  8. LEK-Introduction

    LEK - logstash + elasticsearch + Kibana Elasticsearch, Logstash, and Kibana — designed to take data ...

  9. jquery 学习笔记(1)

    $就是jquery的一个简写形式 如$('#foo')和jQuery('#foo')是等价的,  $.ajax和  jQuery.ajax是等价的   $符号是jQuery的一个简写形式 window ...

  10. 【界面优化】使用viewpagerindicator添加下划线滑动动画

    开源代码viewpagerindicator里面没有实现tab下划线切换过程中的移动动画,都是很突兀的多个fragement之间的切换,导致用户体验略差,google了下相关问题,发现一片博文: ht ...