介绍编译的less的两种IDE工具

介绍编译的less的两种IDE工具

现在css预编译越来越普及了,著名的有less、sass、stylus等等等等。功能上基本上都是大同小异。这些个玩意儿主要表达的意思就是:“像编程一样的编写你的css”。

我在群里面看到好多的网友都是用koala这个工具编译less,这个工具我也用过,但是我觉得他很麻烦。

 

下面我介绍两个IDE工具,它们都能解析less,关键是不用那么麻烦,废话不多说,下面开始介绍:

 

第一种:webstorm (强大前端开发IDE)

我在前面的博文介绍过webstorm 安装less解析成css的文章。

点击这里:webstorm9.3 安装less 编译css教程

本文就不在介绍了。

 

 

第二种:HBuilder  (自带less编译插件)

今天主要介绍这款工具的,

首先,你得下载这个工具,下载地址:http://www.dcloud.io/

 

下载完成后,打开软件。

wps3F47.tmp

 

 

选择,“工具” -> “插件安装”

wps3F58.tmp

 

找到“less sass编译插件”,如果默认没有安装 ,就点击安装,安装过的直接使用就可以了,安装都免了

wps3F59.tmp

 

好了,到这里基本上安装这一步就完成了,下面介绍如何使用HBulider编译less?

 

首先新建项目web项目。

文件 -> 新建 -> web项目

wps3F5A.tmp

 

新建完成如下:

wps3F5B.tmp

 

在css文件夹下面新建style.less文件

wps3F5C.tmp

 

“ctrl + s”保存,会在同级文件下面生成style.css文件

wps3F5D.tmp

 

打开style.css文件,如下:

wps3F5E.tmp

 

好了,搞定了,直接引用解析的css就可以了

 

gif操作展示:

less

本教程到这里就结束了。so easy 吧(*^__^*)


  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值