webstoem自动编译less文件
- 去node的主页下载对应版本的nodejs然后安装下载地址:http://nodejs.org/ 根据自己的系统选择合适的版本下载。
- 安装完成之后打开命令提示符(win+r 输入cmd 回车),分别输入node -v以及npm -v如果返回版本号说明你安装成功了
- 接下来就可以安装less了,在“命令提示符”下运行命令“npm install less -g”,然后npm就自动开始下载并安装LESS。
- 配置webstorm(版本10),点击“文件”> "设置"(Ctrl+Alt+S) 弹出设置界面,在左侧导航找到“工具(tool)">"file Watchers" 点击“+”号按钮找到less文件选项点击添加。
- 配置参数
- Arguments : --no-color --source-map=$FileNameWithoutExtension$.css.map $FileName$
- Output paths to refresh : $FileNameWithoutExtension$.css:$FileNameWithoutExtension$.css.map
- 配置完参数后,写完less代码后,会直接在less文件的目录下生成一个.css文件和一个.css.map文件
- .css.map文件的作用是可以直观的在浏览器调试界面看到的是less文件的第几行
- 因为你是用less写的样式,less会编译成css显示在页面上。
- 但有个麻烦,浏览器里看的都是css第几排,而你编辑的又是less文件,很难对上。
- 这个时候有了source map,浏览器里直接显示less,非常方便。
webstoem自动编译less文件的更多相关文章
- Eclipse不自动编译java文件的终极解决方案
最近我的eclipse经常犯傻,项目中总是有很多,启动项目也是没有启动类.查了下项目中生成的class文件,我靠竟然没有,或者还是以前的.原来是eclipse犯傻了,它没帮我自动编译java文件.一般 ...
- Eclipse不能自动编译 java文件的解决方案
前段时间出现了eclipse 不自动编译java文件的问题,在网上找了好长时间,总算把问题解决了,现在把这个问题的解决方法总结一下. 1,看看project -- Build Automaticall ...
- Eclipse不能自动编译 java文件
在网上的解决方法 方法参考如下: (1) Window-->Preferences-->General-->Workspace 有个"Build automatica ...
- Eclipse不能自动编译 java文件,不会生成CLASS
每次修改类代码后都得重启 Tomcat 花了1天终于解决,网上所说基本是下面1和2的方法,使用之后还是不行最后重新建工作环境导入项目对比了一下找到第三种方法 1.Project 下有个 "B ...
- Tomcat不能自动编译JSP文件问题的一种解决方法
今天碰到一个非常奇怪的问题,机器环境是JDK8.Tomcat8,把jQuery MiniUI ( for Java Eclipse)下载后导入到Eclipse中,首页可以显示,但运行操作数据库的页面出 ...
- 安利一个MVC的好东西,RazorGenerator.MsBuild,可以自动编译cshtml文件
在传统的asp.net webForm 开发里,在发布时,如果选择预编译,就会自动将所有的aspx 文件编译,在发布后的目录里,就看不到aspx的源代码了,同时因为是预编译的,所以每个页面打开速度都挺 ...
- 利用babel自动编译es6文件
一.检查File-Watchers中Babel的Arguments,有一项presets的设置,把他更改为=es2015,详细设置如下: $FilePathRelativeToProjectRoot$ ...
- WebStorm怎么设置实现自动编译less文件
首先,需要保证电脑安装过Node.js,下载地址:https://nodejs.org/en/ 安装Node.js的时候会自动安装npm 然后,安装lessc模块 打开cmd控制台 输入下面一行npm ...
- Grunt 自动编译 Less 文件配置
1.安装Grunt http://www.gruntjs.net/getting-started 2.编辑 package.json 文件 { "name": "Grun ...
随机推荐
- WPF 命令的简单总结
WPF的命令Command主要解决的问题,就是代码复用.一个很重要的应用意义,在于它将很多地方需要的调用的相同操作,以统一的方式管理,却又提供了不同的访问结果. 举个例子来说,我可能通过“点击butt ...
- MVC 5 属性路由中添加自己的自定义约束
介绍约束 ASP.NET MVC和web api 同时支持简单和自定义约束,简单的约束看起来像: routes.MapRoute("blog", "{year}/{mon ...
- Java中的字面量
在计算机科学中,字面量(literal)是用于表达源代码中一个固定值的表示法(natation).几乎所有计算机编程语言都具有对基本值的字面量表示,诸如:整数.浮点数以及字符串:而有很多也对布尔类型和 ...
- centos7 crontab笔记
1.crontab相关命令 语法:crontab [-u <用户名称>][配置文件] 或 crontab [-u <用户名称>][-elr] 参数: -e 编辑该用户的计时器设 ...
- Linux监控工具vmstat命令详解
一.前言 很显然从名字中我们就可以知道vmstat是一个查看虚拟内存(Virtual Memory)使用状况的工具,但是怎样通过vmstat来发现系统中的瓶颈呢?在回答这个问题前,还是让我们回 ...
- rhel7.2 yum
redhat 的更新包只对注册的用户生效,所以我们自己手动更改成CentOS 的更新包,CentOS几乎和redhat是一样的,所以无需担心软件包是否可安装,安装之后是否有问题. (前提是wget包已 ...
- boolean attribute(布尔值属性) attribute vs property
boolean attribute(布尔值属性) boolean attribute HTML - Why boolean attributes do not have boolean val ...
- Asp.Net MVC2.0 Url 路由入门---实例篇
本篇主要讲述Routing组件的作用,以及举几个实例来学习Asp.Net MVC2.0 Url路由技术. 接着上一篇开始讲,我们在Global.asax中注册一条路由后,我们的请求是怎么转到相应的Vi ...
- 《学习的艺术》 (The Art of Learning)
这是我本科期间读过的的一本,个人感觉很有价值的书.当时刚刚失恋,正在思考人生,看这本书的时候,收获很多. 划小圈 (Making Smaller Circles)
- ajax对文件上传
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...