WebStorm 8.0安装LESS编译环境的教程

WebStorm是一个非常棒的Web前端开发编辑器,被程序猿们成为“最智能的JavaScript IDE”。对HTML5、Bootstrap框架、Node.js等都有完美支持。目前最新版本为WebStorm 8.0.x。下面就介绍一下如何在WebStorm 8.0安装LESS编译环境。

1、首先安装WebStorm 8.0

在官方下载并安装WebStorm 8.0.x,具体步骤就不说了,没什么特别之处。

2、安装NodeJs

NodeJs官方版本有32位和64位,可以根据实际需要进行选择安装。

安装成功后,在“命令提示符”(Win+R)下运行“node -v”和“npm -v”能够显示版本号就说明成功了(如图)。

3、安装LESS

在“命令提示符”下运行命令“npm install less -g”,然后npm就开始下载并安装LESS。

安装成功的界面是这样的(如图)。

在这里,我们能够看到lessc安装的目录,这个要先记下来。

4、在WebStorm里面配置LESS编译

这个步骤稍微复杂一些,打开WebStorm,找到“File -> Settings”,在“IDE Settings”里面找到“External Tools”。

点击“+”,如图填写“Name”和“Group”,在“Tool settings”里面有三个项目需要填写。“Program”选择“node.exe”的实际路径,“Working directory”就是nodejs的安装目录。

最重要的就是“Parameters”,格式为:

lessc安装的目录lessc $FilePath$

这里就用到了之前我们记录下来的lessc安装的目录。

我这里实际上是:

C:Users用户名AppDataRoamingpmode_moduleslessinlessc $FilePath$

到这里,就完成一大半了。现在我们可以新建一个工程,并且打开一个less文件了。

在初次打开less文件的时候,在编辑界面的右上方会出现一个“Add watcher”链接,这里就是为了为此项目的less文件配置watcher的地方,点击开可以对输出路径进行配置“Output paths to refresh”,其他配置无需变化。

如果想再次修改watcher,在“File -> Settings -> External Tools(外部工具)”里面可以再次修改。

时间: 2024-08-05 12:01:43

WebStorm 8.0安装LESS编译环境的教程的相关文章

CentOS7.0 安装JAVA周围环境

CentOS7.0 安装JAVA周围环境  安装JDK 1.配置JDK环境变量 把下载好的JDK(jdk-7u75-linux-x64.gz)文件上传到 Reg: /home/p2pweb/java/ 文件夹下(文件夹可自己定义) [[email protected] ~]# tar -zxv -f jdk-7u75-linux-x64.gz // 解压压缩包 [[email protected] ~]# rm -rf jdk-7u75-linux-x64.gz // 删除压缩包 [[email

Linux和Ubuntu环境下B2G(Firefox OS)安装、编译、测试教程集合

1在ubuntu上测试Firefox OS(B2G)系统 Firefox OS,项目代号为"Boot 2 Gecko",是一个开放的完全基于WEB标准的智能手机操作系统,由Mozilla公司开发.Firefox OS 底层属于Linux,开放的Web技术,而不是特定于平台的原生API,用HTML5 编写应用程序.Firefox OS 每日构建版目前可在电脑桌面上试用. 安装过程非常简单,下面是详细的步骤说明: 点 这里 下载 ... 2在 ubuntu系统上建立b2g系统(翻译) 你已

Windows Server 2003 IIS6.0+PHP5(FastCGI)+MySQL5环境搭建教程

准备篇 一.环境说明: 操作系统:Windows Server 2003 SP2 32位 PHP版本:php 5.3.14 MySQL版本:MySQL5.5.25 二.相关软件下载: 1.PHP下载地址: http://windows.php.net/downloads/releases/php-5.3.14-nts-Win32-VC9-x86.zip 2.MySQL下载地址: http://gd.tuwien.ac.at/db/mysql/Downloads/MySQLInstaller/my

loadrunner11.0 安装破解详解使用教程

loadrunner11.0 安装破解详解使用教程 来源:互联网 作者:佚名 时间:01-21 10:25:34 [大 中 小] 很多朋友下载了loadrunner11但不是很会使用,这里简单介绍下安装教程,需要的朋友可以参考下 Loadrunner安装详解 一 .下载篇. 我的下载地址是:http://www.jb51.net/softs/71240.html 程序4G多,很大. 二.           安装篇 1.运行“setup.exe” 2. 点击安装,其中会有提示缺少“Microso

在Ubuntu安装go编译环境

好记性不如烂笔头,所以趁热打铁记录下golang编译环境的安装过程. 首先下载一些依赖包: sudo apt-get install bison ed gawk gcc libc6-dev make 然后安装Mercurial. Mercurial是一款版本管理系统,golang是利用它来管理版本的. sudo apt-get install python-setuptools sudo apt-get install python-dev sudo apt-get install build-

centos6.5下安装gradle编译环境

现在用gradle替代maven的项目越来越多,下面就描述一下如何在centos服务器环境下安装配置gradle环境. 1.在http://www.gradle.org/downloads页面,下载最新版的gradle软件包,撰写这篇文档的时候是2.2.1版. 2.下载了gradle-2.2.1-all.zip或者gradle-2.2.1-bin.zip文件之后,将之解压在/usr/local目录下 $cd /usr/local $sudo unzip ~/gradle-2.2.1-all.zi

【webstorm】webstorm10配置less编译环境(如何添加less的file watchers)

1.首先基本环境要提前搭建好,node.js提前安装好 2.less可以通过node.js的NPM安装(全局安装):npm install less -g 3.webstorm10(低于10的没测试,不知道),操作:File→Settings→Tools→File Watchers,点击右侧绿色“+”号: 4.填写参数: 保存less文件,自动编译为css文件. 注意:编译后新的css文件是折叠在这里的 展开: 不容易发现 有空弄:生成的css自动放到dist等文件夹中,并且html文件的引用时

菜鸟自学红帽存储——RHSS3.0安装及学习环境搭建

菜鸟在这里献丑了,我是0基础学习的linux,现在已经半年了,现在正在学红帽的存储管理,学习资料就是官方文档了,这个在官网可以下到,再加上论坛的一些资料,然后我就开始在这里卖萌了. 红帽的存储还是有一定的优势的,可扩展性好,采用scale-out模式,容量不够了直接加brick就行了,管理也很方便,入手也很快,所以我就开始自学了,当然我是一边自学一边贴博文,难免会有错误,还请各位大神路过给点意见. 红帽存储最新的是Red Hat Storage Server 3,系统的版本最新的已经是RHEL6

Centos 安装 Go 编译环境

1.下载go(最新版列表 https://studygolang.com/dl) wget -c https://studygolang.com/dl/golang/go1.13.5.linux-amd64.tar.gz 2.解压go到 /opt/ tar -C /opt/ -zxvf go1.13.5.linux-amd64.tar.gz 3.增加环境变量,编辑 /etc/profile 增加如下三行 export PATH=$PATH:/opt/go/bin export GOROOT=/o