一、下载安装 atom-less

atom-less 项目在这里:https://github.com/schmuli/atom-less

安装方法请参考这篇博文:http://blog.csdn.net/kingittiger/article/details/51881442

二、使用方法

atom-less 的使用略显奇葩。跟其它 LESS 插件不同,它需要在每个 less 文件的头部都写上配置行,编译器读取这行配置,才可以正常运作。好处是,不同的 less 就可以用不同的配置,做到灵活输出,不用频繁去设置全局参数。

1. 官方参考说明 README.md

# atom-less package

An Atom package that auto-compiles LESS files on save, with support for LESS plugins, Clean-CSS and AutoPrefixer.

### Configuration

On the first line of LESS files, add a valid JSON comment, not including the outer brackets ('{' and '}'), with the following properties:

- **"main"**: `string` -
The relative or absolute path to the main LESS file to be compiled (ignores all other options)
- **"out"**: `boolean|string` -
`true` to output using the filename, or a string specifying a name to use
- **"compress"**: `boolean` -
Use Less.JS built-in compression (not compatible with Clean-CSS or Source Maps)
- **"strictMath"**: `boolean` -
Require brackets around math expressions
- **"sourceMap"**: `boolean|Object` -
`true` to turn on source maps, or an object specifying LESS source map properties
- **"cleancss"**: `string|object` -
a string specifying the 'compatibility' property,
or an object specifying the Clean-CSS properties (not compatible with Source Maps)
- **"autoprefixer"**: `string|object` -
a `;` separated string specifying the 'browsers' property,
or an object specifying the AutoPrefixer properties Other LESS compiler options might work but are untested at this point. ### Road Map
1. Remove dependency on inline comments, and instead use a .lesscfg project file, allowing easier configuration and automatic support of additional LESS plugins
2. Change callback passing to use Promises

来源:https://atom.io/packages/atom-less

2. 常用选项配置

其实常用的选项就两个:out 和 compressout 配置输出,compress 配置是否压缩。配置要写成 JSON 注释形式,但不包含花括号 { }

配置形式:

// "<选项1>": "<配置1>", "<选项2>": "<配置2>", ...

下面举几个例子:

// "out": true                  ## 输出同名的 css 文件,不压缩
// "out": "test.css" ## 输出名为 test.css 文件,不压缩
// "out": true, "compress": true ## 输出名为 test.css 文件,压缩

3. 常见问题问答

Atom Editor 插件 atom-less 的使用方法的更多相关文章

  1. Atom插件无法下载安装解决办法,Atom使用教程,Atom常用插件

    使用教程http://wiki.jikexueyuan.com/project/atom/plug-in.html atom通过setting中无法下载插件,通过apm也无法下载插件,可能是网络.co ...

  2. atom常用插件安装

    安装插件方法: File -Settings -Install 在搜索框里搜索你想要的插件,出来之后 点击install ,下图以 linter-selint 为例 ATOM常用插件推荐 simpli ...

  3. Atom 编辑器插件:amWiki 轻文库

    amWiki 是一款基于 Javascript 脚本语言.依赖 Atom 编辑器.使用 Markdown 标记语法的轻量级开源 wiki 文库系统. amWiki 致力于让大家可以更简单.更便捷的建设 ...

  4. Facebook的ATOM Editor的底层Electron

    Facebook的ATOM Editor的底层Electron 开源牛人 zcbenz 事情是这样的,微软推出了Visual Studio Code,我很好奇他怎么做跨平台的,所以就找找资料,在他的网 ...

  5. ATOM常用插件推荐

    转载:http://blog.csdn.net/qq_30100043/article/details/53558381 ATOM常用插件推荐 simplified-chinese-menu ATOM ...

  6. Android x86模拟器Intel Atom x86 System Image配置与使用方法

    Android x86模拟器Intel Atom x86 System Image配置与使用方法      前言:      大家现在开发使用的Android 模拟器模拟的是 ARM 的体系结构(ar ...

  7. Atom使用插件精选

    小颖之前公司的大哥推荐小颖用的编辑器是atom,之前都是他给小颖了一个atom插件安装列表,小颖电脑出了点问题,所以后来小颖把那弄丢了,小颖重装atom后,就不知道要安装什么插件,所以也百度了很多,今 ...

  8. [转]Android x86模拟器Intel Atom x86 System Image配置与使用方法

    Android x86模拟器Intel Atom x86 System Image配置与使用方法 前言: 大家现在开发使用的Android 模拟器模拟的是 ARM 的体系结构(arm-eabi),因此 ...

  9. 【编程工具】Sublime Text3 之 Emmet 插件的详细使用的方法

    这篇关于 Emmet 插件使用的博文之前就想写了,今天刚好闲暇时间,就花了一些时间进行了总结. 我们都这道 Emmet 这款插件在前端设计里被称为神器,确实,神器称号名不虚传.因为这款插件可以帮助我们 ...

随机推荐

  1. [BZOJ3563&3569]DZY Loves Chinese

    bzoj 加强版 sol 其实前一题还有一种解法的,具体方法请见bzoj讨论版. 以下是正解(?) 建一棵生成树. 考虑什么时候图会不连通:当且仅当存在一条树边被删除,同时所有覆盖了他的非树边也被删除 ...

  2. 5、Java并发编程:Lock

    Java并发编程:Lock 在上一篇文章中我们讲到了如何使用关键字synchronized来实现同步访问.本文我们继续来探讨这个问题,从Java 5之后,在java.util.concurrent.l ...

  3. Spring Boot中使用缓存

    Spring Boot中使用缓存 随着时间的积累,应用的使用用户不断增加,数据规模也越来越大,往往数据库查询操作会成为影响用户使用体验的瓶颈,此时使用缓存往往是解决这一问题非常好的手段之一. 原始的使 ...

  4. PyYAML学习第一篇

    1. YAML是一种交互式和可读性强的脚本语言.脚本语言都是解释性语言. PyYAML是YAML语言的编辑器和解释器.在python语言里面有PyYAML的安装包. 相关学习文档:http://pyy ...

  5. Python全栈 进阶(进阶内容都在这了)

    原文地址 https://yq.aliyun.com/articles/632754?spm=a2c4e.11155435.0.0.23eb3312feB6dG ................... ...

  6. leetcode-回文链表

    请判断一个链表是否为回文链表. 示例 1: 输入: 1->2 输出: false 示例 2: 输入: 1->2->2->1 输出: true 进阶:你能否用 O(n) 时间复杂 ...

  7. 谜题 (Puzzle,ACM/ICPC World Finals 1993,UVa227)

    题目描述:算法竞赛入门经典习题3-5 题目思路:模拟题 #include <stdio.h> #include <string.h> #define maxn 55 char ...

  8. Java学习笔记-10.io流

    1.输入流,只能从中读取数据,而不能向其写出数据.输出流,只能想起写入字节数据,而不能从中读取. 2.InputStream的类型有: ByteArrayInputStream 包含一个内存缓冲区,字 ...

  9. 十 Writing YARN Applications

    本节介绍:     使用yarn 高级提交写yarn应用程序.其实已经yarn底层API.MR计算框架对底层的API实现了封装. 高级提交指直接使用yarn的三种接口来提交应用程序: 1)YarnCl ...

  10. 团队Beta阶段事后分析

    团队Beta阶段事后分析 设想和目标 我们的软件要解决什么问题?是否定义得很清楚?是否对典型用户和典型场景有清晰的描述? 我们的软件要解决用户的休闲娱乐问题,为用户提供好玩的模拟经营类的游戏,游戏主题 ...