WebStorm怎么设置实现自动编译less文件
首先,需要保证电脑安装过Node.js,下载地址:https://nodejs.org/en/
安装Node.js的时候会自动安装npm

然后,安装lessc模块
打开cmd控制台
输入下面一行npm命令,安装less模块:-g是全局安装,如果不加会安装在当前目录。
npm install less -g

安装less-plugin-clean-css插件(less的插件,用于压缩代码)
npm install less-plugin-clean-css -g

PHPStorm 点击File>Settings>Tools>File Watcher 添加less自动编译参数

PhpStrom会自动识别lessc.cmd文件,如果不能识别,手动找到npm目录的lessc.cmd文件即可,我这里添加的--clean-css参数会自动代码压缩,也可以不加,就不会自动压缩代码了。

这样在项目里编辑less文件时,会自动时时生成css文件了
效果如下:

WebStorm怎么设置实现自动编译less文件的更多相关文章
- webstorm 设置 sass自动编译问题
sass语法.使用它带来的好处,就不再这里做介绍了,主要看怎么在webstorm里配置自动编译. sass编译是需要Ruby环境的,可以到这里去下载 : https://rubyinstaller ...
- Eclipse不自动编译java文件的终极解决方案
最近我的eclipse经常犯傻,项目中总是有很多,启动项目也是没有启动类.查了下项目中生成的class文件,我靠竟然没有,或者还是以前的.原来是eclipse犯傻了,它没帮我自动编译java文件.一般 ...
- Eclipse不能自动编译 java文件的解决方案
前段时间出现了eclipse 不自动编译java文件的问题,在网上找了好长时间,总算把问题解决了,现在把这个问题的解决方法总结一下. 1,看看project -- Build Automaticall ...
- Eclipse不能自动编译 java文件,不会生成CLASS
每次修改类代码后都得重启 Tomcat 花了1天终于解决,网上所说基本是下面1和2的方法,使用之后还是不行最后重新建工作环境导入项目对比了一下找到第三种方法 1.Project 下有个 "B ...
- Eclipse不能自动编译 java文件
在网上的解决方法 方法参考如下: (1) Window-->Preferences-->General-->Workspace 有个"Build automatica ...
- Tomcat不能自动编译JSP文件问题的一种解决方法
今天碰到一个非常奇怪的问题,机器环境是JDK8.Tomcat8,把jQuery MiniUI ( for Java Eclipse)下载后导入到Eclipse中,首页可以显示,但运行操作数据库的页面出 ...
- webstoem自动编译less文件
去node的主页下载对应版本的nodejs然后安装下载地址:http://nodejs.org/ 根据自己的系统选择合适的版本下载. 安装完成之后打开命令提示符(win+r 输入cmd 回车),分 ...
- 安利一个MVC的好东西,RazorGenerator.MsBuild,可以自动编译cshtml文件
在传统的asp.net webForm 开发里,在发布时,如果选择预编译,就会自动将所有的aspx 文件编译,在发布后的目录里,就看不到aspx的源代码了,同时因为是预编译的,所以每个页面打开速度都挺 ...
- 利用babel自动编译es6文件
一.检查File-Watchers中Babel的Arguments,有一项presets的设置,把他更改为=es2015,详细设置如下: $FilePathRelativeToProjectRoot$ ...
随机推荐
- Django基础006--在pycharm中将项目配置为Django项目
1.在File--Settings--搜索Django 操作按照如图所示 2.在pycharm右上方项目处,选择Edit Configurations 3.在Name处写上项目名称 python环境选 ...
- postman使用笔记
postman主要是用来做接口测试的工具,用来模拟客户端向服务器发起请求. 一.postman支持的请求类型 1.get请求 get请求是用来向服务器获取数据 get请求没有请求体,只有url和请求头 ...
- Linux文件系统与日志分析
Linux文件系统与日志分析一.inode与block概述① 文件数据包括元信息(类似文件属性)与实际数据② 文件存储在硬盘上,硬盘最小存储单位是"扇区"(sector),每个扇区 ...
- 双线性插值算法的FPGA实现
本设计预实现720P到1080P的图像放大,输入是YUV444数据,分量像素位宽为10bit,采用的算法为双线性插值法,开发平台是xiinx K7开发板. 双线性插值法即双次线性插值,首先在横向线性插 ...
- Emoji.voto,Linkerd 服务网格(service mesh)的示例应用程序
一个微服务应用程序,允许用户为他们最喜欢的表情符号(emoji)投票,并跟踪排行榜上收到的投票.愿最好的 emoji 获胜. 该应用程序由以下 3 个服务组成: emojivoto-web:Web 前 ...
- IO流 connect reset
目录 出现场景 解决思路 出现场景 通过外部OBS下载10文件,然后通过工具将这10个文件打包成一个文件A.zip上传,最后将这个A.zip下载并解压,解压A.zip后发现文件数量不是10个. 解决思 ...
- Android系统编程入门系列之界面Activity响应丝滑的传统动画
上篇文章介绍了应用程序内对用户操作响应的相关方法位置,简单的响应逻辑可以是从一个界面Activity跳转到另一个界面Activity,也可以是某些视图View的相对变化.然而不管是启动一个界面执行新界 ...
- C++第四十九篇 -- 将一个项目Copy到另一台电脑
最近写项目,由于设备原因,需要将一台电脑的项目拷贝到另一台电脑上,在另一个电脑上继续编写.由于配置属性原因,最终还是在另一台电脑上创建了新项目,只是把这些cpp文件都复制过去了,然后重新部署属性. 背 ...
- Java规范的三种注释方式:
1.单行注释 // //单行注释 2.多行注释 /* */ /* 多行 注释 */ 3.文档注释[java特有的] /** */ ◆注释内容可以被JDK提供的工具javadoc所解析,生成一套以网页文 ...
- 2021qwb [强网先锋]赌徒 Writeup + 环境复现
2021 qwb [强网先锋]赌徒 Writeup + 环境复现(win10) 1.本地环境复现(win10+phpStudy2018) 将比赛文件复制到phpStudy的\phpStudy\PHPT ...