zoukankan      html  css  js  c++  java
  • 介绍编译的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

    2017-4-14日添加

    第三种:Sublime text 3编译less

    Sublime text 3也可以编译less,但在这之前,必须要安装node.js,并配置好环境变量,安装方法网上有很多,博主就不再赘述,Sublime Text3 支持Less,点击即可查看。

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

  • 相关阅读:
    poj 1061 青蛙的约会 ——扩展欧几里得
    2013年4月4日 雨
    hdu3555 Bomb ——数位DP入门题
    2013年4月6日四校联赛总结
    speedcell's SPFA
    nefu118 n!后面有多少个0 数论
    zoj 3409 KKV
    uva 11991 Easy Problem from Rujia Liu?
    zoj 1649 Rescue ——BFS入门题
    poj 3233 Matrix Power Series ——矩阵快速幂+二分求解
  • 原文地址:https://www.cnblogs.com/zhangans/p/5982240.html
Copyright © 2011-2022 走看看