介绍编译的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/

下载完成后,打开软件。

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

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

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

首先新建项目web项目。

文件 -> 新建 -> web项目

新建完成如下:

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

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

打开style.css文件,如下:

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

gif操作展示:

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

介绍编译的less的两种IDE工具的更多相关文章

  1. 介绍编译的less的几种IDE工具

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

  2. JIT(Just in time,即时编译,边运行边编译)、AOT(Ahead Of Time,运行前编译),是两种程序的编译方式

    JIT(Just in time,即时编译,边运行边编译).AOT(Ahead Of Time,运行前编译),是两种程序的编译方式

  3. sitecore中的两种编辑工具介绍

    在Sitecore中,有两种编辑工具,您可以在其中创建和编辑网站上的内容: 内容编辑器 - 专为熟悉Sitecore及其包含的功能的经验丰富的内容作者而设计的应用程序. 体验编辑器 - 一种直观的编辑 ...

  4. Cognos两种建模工具对于复杂日期维度的处理比较(下)

    本文继Cognos两种建模工具对于复杂日期维度的处理比较(上)之后将介绍一下Cognos中建模工具Transform对复杂日期维度的处理. 二:Transform建模对于复杂日期维度的处理 为了书写效 ...

  5. JSON语言规范与Java中两种解析工具基本使用

    转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/6652250.html  一:JSON语言规范 一言以蔽之:“一个 :一个键值对,一个{}一个对象,一个[]一个 ...

  6. Metasploit和python两种安全工具的学习笔记

    Metasploit是个好东西 主要参考了<Metasploit渗透测试魔鬼训练营>这本书. 一.先用自己的靶机感受一下该工具的强大 linux靶机的ip如图 按照书上写的配置,如图 然后 ...

  7. Cognos两种建模工具对于复杂日期维度的处理比较(上)

    众所周知,在数据仓库中,日期维度是相当重要的.对数据分析的过程中可以从不同的角度去分析,比如按照下面的日期层次去分析数据. 年-季度-月-日 年-月-日 年-周-日 本示例将利用简单的商品销售分析的d ...

  8. 在linux环境下编译运行OpenCV程序的两种方法

    原来以为在Ubuntu下安装好了OpenCV之后,自己写个简单的程序应该很容易吧,但是呢,就是为了编译一个简单的显示图片的程序我都快被弄崩溃了. 在谷歌和上StackOverFlow查看相关问题解答之 ...

  9. 跨平台C++开源代码的两种常用编译方式

    作者:朱金灿 来源:http://blog.csdn.net/clever101 跨平台C++开源代码为适应各种编译器的编译,采用了两种方式方面来适配.一种是makefile方式.以著名的空间数据格式 ...

随机推荐

  1. Oracle逻辑结构(TableSpace→Segment→Extent→Block)

    一.逻辑体系结构图 二.逻辑结构图组成介绍 从上表可以看出,一个数据库是由多个表空间(tablespace)组成,一个表空间又由多个段(segment)组成,一个段又由多个区(extent)组成,一个 ...

  2. 【C++】输入多行数字到数组

    前天做某公司笔试题的时候,其输入格式是多行数字,每行以空格为分隔符,以换行符号为结束输入到多个数组.在JAVA中有相应的函数直接将一行拆成数组,感觉在C++中这中输入方式还是挺奇怪的,今天想出一种解决 ...

  3. ubuntu kylin 14.04编译openjdk-7u40

    1.ubuntu kylin 14.04安装依赖 sudo apt-get install build-essential gawk m4 libasound2-dev libcups2-dev li ...

  4. Json解析工具Jackson(简单应用)

    原文http://blog.csdn.net/nomousewch/article/details/8955796 概述 Jackson库(http://jackson.codehaus.org),是 ...

  5. CNI插件源码示例,对于github.com/rajatchopra/ocicni库的分析

    CNI插件初始化 // ocicni.go 1.func InitCNI(pluginDir string) (CNIPlugin, error) (1).先调用plugin := probeNetw ...

  6. COGS 265线段覆盖[线段树]

    265. 线段覆盖 ★★☆   输入文件:xdfg.in   输出文件:xdfg.out   简单对比时间限制:2 s   内存限制:20 MB [问题描述] 有一根长度为 L 的白色条状物.有两种操 ...

  7. Java集合框架之map

    Java集合框架之map. Map的主要实现类有HashMap,LinkedHashMap,TreeMap,等等.具体可参阅API文档. 其中HashMap是无序排序. LinkedHashMap是自 ...

  8. 初学C#和MVC的一些心得,弯路,总结,还有教训(2)--关于Entity Framework

    看了一堆视频教程后,感觉基本了解的差不多了,可以动手.....因为最好的学习方法就是实践嘛.... 所以打算从网站做起,在WebForm和MVC之间选了MVC,因为感觉高大上...也比较灵活 于是买了 ...

  9. JQuery中each()的使用方法说明

    JQuery中each()的使用方法说明 对于jQuery对象,只是把each方法简单的进行了委托:把jQuery对象作为第一个参数传递给jQuery的each方法.换句话说:jQuery提供的eac ...

  10. 了解 JS 原型

    原型概念 当创建了一个函数时,就会根据一组特定的规则为该函数创建一个 prototype 属性,这个属性指向函数的原型对象.在默认情况下,所有原型对象都会自动获得一个constructor 的属性 这 ...