当前位置:首页>Koala教程>Koala学习大纲

Koala学习大纲

作者:微学网发布时间:2019-09-01 12:40:23

Koala学习 知识图谱

Koala简介

如果您正在使用sass,less或者coffee,并且您没有注意到Koala,那么您很可能在很长一段时间内没有更新您的知识库。 在过去的几个月中,考拉(Koala),一个用于编制sass,less和coffee的中文程序,与其他技术一样多。 当然,这与作者的努力工作有很大关系,使他更强大,更好。 感谢Koala作者为我们带来了如此优秀的免费工具。

实际上,有很多编译工具。 我已经尝试了各种免费工具来编译sass,但它们通常都没有,无论是功能有限还是速度都不快。 直到我偶然遇见Koala,我停止搜索并稳定地使用它。 我将根据自己的经验告诉你一些关于Koala的事。

选择koala的7大理由

  • 多语言支持:支持Less、Sass、CoffeeScript 和 Compass Framework。
  • 实时编译:监听文件,当文件改变时自动执行编译,这一切都在后台运行,无需人工操作。
  • 编译选项:既可统一设置文件的编译选项,也可单独设置某个文件的编译选项。
  • 强大的文件右键功能:右键文件元素,即可操作打开文件,打开文件目录,打开输出文件目录,设置输出文件目录,编译,删除六大常用功能。
  • 错误提示:在编译时如果遇到语法的错误,koala将在右下角弹出错误信息,方便开发者定位代码错误位置。
  • 跨平台:windows、linux、mac都能完美运行。
  • 免费且负责:koala完全免费,而且作者很负责,有什么问题作者都会及时给予答复,意见什么的可以直接提交给作者,一般在下一个版本就能得到解决。

简洁美观的面板

koala

以上四个数字分别对应四个区域:

第一个区域:第一个按钮用于添加项目,第二个按钮用于打开编译文件的错误消息,第三个按钮用于设置koala,可以设置所有文件的默认编译输出模式,需要过滤的文件,界面语言(中文/英文)等。这还包括当前的考拉版本号和作者信息。

第二个区域:项目区域,项目可以直接拖入其中

第三个区域:要编译的文件列表。默认情况下,以下划线开头的文件不会出现在列表中。绿色表示动态编译的文件,灰色表示未动态编译的文件。单击相应的文件,出现第四个块,并设置编译文件的选项。如果您的文件稍后添加,请单击上面的刷新按钮刷新需要编译的文件。当然,您也可以通过以下all / less / sass / coffee过滤要编译的文件。

区域4:设置在第三个区域中编译文件的选项。对于sass,第一个选项指示是否启用动态编译。第二组表示是否启用了这四个功能。为方便调试,我打开调试信息。当然,如果你使用指南针,你必须打开指南针。第三组表示输出CSS格式,它分为四种类型:嵌套,压缩,压缩,扩展;最后一个编译按钮可以手动编译。

现在我们熟悉了界面,让我们实际使用它。步骤开始:

简单的使用步骤

第一步:首先点击我们第一区域的那个齿轮按钮,设置下默认文件的编译方式,并把界面语言设置为中文。
koala

koala 添加

第二步:添加我们要编译的项目文件,可通过第一区域的加号那个按钮添加,也可以直接将项目拖到第二个project区域。

第三步:单击我们需要编译的文件,出现第四区域设置下该文件具体的编译方式,如果没什么特别的,直接用默认设置的就ok,如果不需要动态编译,直接勾掉“即时编译”那个checkbox,其余的按照上面说的操作。

koala编译

第四步:右键单击需要编译的文件,出现我们常用的几个操作:打开文件,打开文件目录,打开输出文件目录,设置输出文件目录,编译,删除。一般这里我们需要设置下我们输出文件的目录。
koala输出

第五步:如果你的文件既有less,sass还有coffee,那么就最好有必须点击下面的过滤条件,选择你要动态编译的文件,不然一锅煮头都大了。