介绍编译的less的几种IDE工具
2016-10-20 20:10
323 查看
介绍编译的less的两种IDE工具
现在css预编译越来越普及了,著名的有less、sass、stylus等等等等。功能上基本上都是大同小异。这些个玩意儿主要表达的意思就是:“像编程一样的编写你的css”。
我在群里面看到好多的网友都是用koala这个工具编译less,这个工具我也用过,但是我觉得他很麻烦。
下面我介绍两个IDE工具,它们都能解析less,关键是不用那么麻烦,废话不多说,下面开始介绍:
第一种:webstorm (强大前端开发IDE)
我在前面的博文介绍过webstorm 安装less解析成css的文章。
第二种:HBuilder (自带less编译插件)
今天主要介绍这款工具的,
首先,你得下载这个工具,下载地址:http://www.dcloud.io/
下载完成后,打开软件。
选择,“工具” -> “插件安装”
找到“less sass编译插件”,如果默认没有安装 ,就点击安装,安装过的直接使用就可以了,安装都免了
好了,到这里基本上安装这一步就完成了,下面介绍如何使用HBulider编译less?
首先新建项目web项目。
文件 -> 新建 -> web项目
新建完成如下:
在css文件夹下面新建style.less文件
“ctrl + s”保存,会在同级文件下面生成style.css文件
打开style.css文件,如下:
好了,搞定了,直接引用解析的css就可以了
gif操作展示:
2017-4-14日添加
第三种:Sublime text 3编译less
Sublime text 3也可以编译less,但在这之前,必须要安装node.js,并配置好环境变量,安装方法网上有很多,博主就不再赘述,Sublime Text3 支持Less,点击即可查看。
本教程到这里就结束了。so easy 吧(*^__^*)
现在css预编译越来越普及了,著名的有less、sass、stylus等等等等。功能上基本上都是大同小异。这些个玩意儿主要表达的意思就是:“像编程一样的编写你的css”。
我在群里面看到好多的网友都是用koala这个工具编译less,这个工具我也用过,但是我觉得他很麻烦。
下面我介绍两个IDE工具,它们都能解析less,关键是不用那么麻烦,废话不多说,下面开始介绍:
第一种:webstorm (强大前端开发IDE)
我在前面的博文介绍过webstorm 安装less解析成css的文章。
点击这里:webstorm9.3 安装less 编译css教程
本文就不在介绍了。第二种:HBuilder (自带less编译插件)
今天主要介绍这款工具的,
首先,你得下载这个工具,下载地址:http://www.dcloud.io/
下载完成后,打开软件。
选择,“工具” -> “插件安装”
找到“less sass编译插件”,如果默认没有安装 ,就点击安装,安装过的直接使用就可以了,安装都免了
好了,到这里基本上安装这一步就完成了,下面介绍如何使用HBulider编译less?
首先新建项目web项目。
文件 -> 新建 -> web项目
新建完成如下:
在css文件夹下面新建style.less文件
“ctrl + s”保存,会在同级文件下面生成style.css文件
打开style.css文件,如下:
好了,搞定了,直接引用解析的css就可以了
gif操作展示:
2017-4-14日添加
第三种:Sublime text 3编译less
Sublime text 3也可以编译less,但在这之前,必须要安装node.js,并配置好环境变量,安装方法网上有很多,博主就不再赘述,Sublime Text3 支持Less,点击即可查看。
本教程到这里就结束了。so easy 吧(*^__^*)
相关文章推荐
- 介绍编译的less的两种IDE工具
- less及编译工具介绍
- less及编译工具介绍
- less及编译工具介绍
- Linux-IDE编译工具的开发介绍
- 高通平台的常用的编译IDE工具RVDS,MDK, ADS介绍
- 系统封装教程---之几种常用封装工具和驱动包的简单介绍
- 介绍CSS编译工具CSS Lint
- jda反编译工具的使用介绍《转》
- Linux C/C++标准库使用及嵌入式开发交叉编译工具介绍
- Python几种开发工具介绍
- android反编译工具apktool介绍(反编译xml的工具)(转载)
- Python几种开发工具介绍
- PhoneGap工具Cloud9 IDE介绍以及使用方法
- 从编译到工具:几种mysql的优化方法
- 三种SQLite数据库管理工具(IDE)的介绍及区别
- Linux 文件内容查看工具介绍--cat,less,more,tail,head//http://blog.sina.com.cn/s/blog_737103810100qsxk.html
- 定制ARM For Linux交叉编译工具详细介绍
- 介绍Python程序员常用的IDE和其它开发工具
- linux下c/c++ IDE开发工具介绍