HBuilder配置Less或者Sass自动编译

关于Less\Sass或者其他CSS预处理语言的讲解，这里都没有！
这里主要讲的是HBulider里面怎样开启Less自动编译功能，实现我们编写less的时候，自动生成对应的css而不用每次都手动编译一次，实现自动化。

首先，你的电脑里面必须有less编译环境才行，如下图箭头所指的lessc.cmd。
如果没有也不要着急，用node.js安装一下less即可，git里的命令行是“npm install -g less”，cmd得在前面加上“$”符，mac系统我不管。文件安装完成后的位置都差不多，划红线的位置不同电脑路径名不一样。

配置环境已经OK，打开HBuilder,在顶部菜单工具–》找到预编译器设置选项。如下图：

这是我的已经配置好的，假设你什么都没有配置。点击新建，你会看到如下界面。

先把文件后缀名填一下，用less的填写.less后缀就行，然后点击红框里面的自动完成，它就帮你自动填写好相关的路径了，点击确定保存配置！然后你就可以新建less文件然后开始写代码，保存的时候你会发现它帮你建立了一个同名的css文件并且自动把你的less编译成对应的css了，超爽的！

另外我附带提一下VS2015和VS2017里面的Less自动编译的方法，你只用在你的VS里面安装一个叫做LESS Compiler的插件就可以了。然后新建less文件，发现代码编辑窗口多了一个开关，开启它之后就写less的时候会自动生成一个同名的CSS文件和一个压缩版的同名CSS文件，同样爽的不行！

HBuilder配置Less或者Sass自动编译相关推荐

在eclipse中配置android ndk的自动编译环境builders
无论linux还是mac在jni目录中直接运行 ndk-build 就可以生成 lib目录及所需要的 so文件: windows 装上lnx模拟器也是一样: 每次修改完 c++代码, 都要运行一下 ...
webstorm和intellij idea下如何自动编译sass和scss文件
前言学过css的人都知道,css他不是一个编程语言.虽然你可以用css去写网页样式,但是你却没法使用它进行编程.所以有一句话来描述css我个人觉得再合适不过了,"CSS基本上是设计师的工具 ...
使用gulp+browser-sync搭建Sass自动化编译以及自动刷新所需要的插件
使用gulp+browser-sync搭建Sass自动化编译以及自动刷新所需要的插件按照gulp需求插件安装browser-sync(在命令行中输入) npm install --save-dev ...
WebStorm、PHPStorm、IntelliJ IDEA配置scss自动编译
为什么80%的码农都做不了架构师?>>> 一.安装rubu环境本文转自:https://www.edik.cn/article/61.html 1.下载ruby 因为sass ...
前端自动化之sass实时编译及自动刷新浏览器
gulp livereload实现sass实时编译及浏览器自动刷新首先gulp是基于Node的,所以确保你已经安装 node.js,在Nodejs官方网站下载跟自己操作系统相对应的安装包. 先说一下 ...
第10步 (1)logback.xml日志配置(2) ftp(上传文件)服务器配置(3) idea注入和自动编译配置(4)项目提交gitee(5)fe助手和restlet client
**************************************************************************************************** ...
在Eclipse中配置NDK自动编译环境builders
对于NDK的编译,切换到目标目录下,运行ndk-build脚本即可. 对于使用Eclipse开发,我们希望EC能自动的编译我们的NDK,那么只需要为工程添加一个Builders即可. 对于Window ...
Android 持续集成实践（二）——配置 Docker + gitlab-runner 实现线上自动编译
文章目录前言系列文章 Android 持续集成实践(二)--配置 Docker + gitlab-runner 实现线上自动编译安装 Docker 安装 gitlab-runner 安装注册 ...
SASS界面编译工具—Koala的使用及中国镜像下载
<SASS界面编译工具--Codekit的使用>一文中图解了"CodeKit"图形工具编译SASS项目.由于CodeKit是一款付费工具,而且只能在Mac中使用,因此国 ...

HBuilder配置Less或者Sass自动编译

HBuilder配置Less或者Sass自动编译相关推荐

最新文章

热门文章