使用命令行编译Less源文件

用命令行编译Less源文件需要先安装node.js，官方下载地址：http://nodejs.org/

使用npm包管理工具安装Less编译器

npm install less -g

参数-g 是安装到全部环境中的指令，如果只想安装特定版本，可使用如下命令

npm install less@1.6.2 -g

Less编译器用法：

Usage: lessc [option option=parameter ...] <source> [destination]

示例：

E:DevDev2015less compile dir>lessc bootstrap.less bootstrap.css

这样就会生产.css文件

压缩输出文件大小

lessc -x bootstrap.less bootstrap.css

通过使用-x参数，来压缩输出文件的大小，下面是压缩前后的文件大小

-x 压缩主要是删除多余空白实现的

获取帮助

lessc --help

或

lessc -h

 其他常用命令

输出导文件的依赖关系列表

 -M, --depends            Outputs a makefile import dependency list to stdout.

禁用颜色

--no-color               Disables colorized output.

禁用IE兼容性检查

--no-ie-compat           Disables IE compatibility checks.

禁用JavaScript

--no-js                  Disables JavaScript in less files

语法检查

-l, --lint               Syntax check only (lint).

忽略警告信息

-s, --silent             Suppresses output of error messages.

 --strict-imports         Forces evaluation of imports.

允许导入不安全的https主机

 --insecure               Allows imports from insecure https hosts.

插件的使用

--plugin=PLUGIN=OPTIONS  Loads a plugin. You can also omit the --plugin= if the plugin begins
                         less-plugin. E.g. the clean css plugin is called less-plugin-clean-css
                         once installed (npm install less-plugin-clean-css), use either with
                         --plugin=less-plugin-clean-css or just --clean-css
                         specify options afterwards e.g. --plugin=less-plugin-clean-css="advanced"
                         or --clean-css="advanced"

安装插件

PS E:DevDev2015less compile dir> npm install less-plugin-clean-css
less-plugin-clean-css@1.5.0 node_modulesless-plugin-clean-css
└── clean-css@3.1.2 (commander@2.6.0, source-map@0.1.43)
PS E:DevDev2015less compile dir>

使用less-plugin-clean-css插件进行输出压缩

lessc --plugin=less-plugin-clean-css .ootstrap.less bootstrap.css

查看版本

 -v, --version            Prints version number and exit.

 --source-map[=FILENAME]  Outputs a v3 sourcemap to the filename (or output filename.map).
 --source-map-rootpath=X  Adds this path onto the sourcemap filename and less file paths.
 --source-map-basepath=X  Sets sourcemap base path, defaults to current working directory.
 --source-map-less-inline Puts the less files into the map instead of referencing them.
 --source-map-map-inline  Puts the map (and any less files) as a base64 data uri into the output css file.
 --source-map-url=URL     Sets a custom URL to map file, for sourceMappingURL comment
                          in generated CSS file.
 -rp, --rootpath=URL      Sets rootpath for url rewriting in relative imports and urls
                          Works with or without the relative-urls option.
 -ru, --relative-urls     Re-writes relative urls to the base less file.
 -sm=on|off               Turns on or off strict math, where in strict mode, math.
 --strict-math=on|off     Requires brackets. This option may default to on and then
                          be removed in the future.
 -su=on|off               Allows mixed units, e.g. 1px+1em or 1px*1px which have units
 --strict-units=on|off    that cannot be represented.
 --global-var='VAR=VALUE' Defines a variable that can be referenced by the file.
 --modify-var='VAR=VALUE' Modifies a variable already declared in the file.
 --url-args='QUERYSTRING' Adds params into url tokens (e.g. 42, cb=42 or 'a=1&b=2')
 --plugin=PLUGIN=OPTIONS  Loads a plugin. You can also omit the --plugin= if the plugin begins
                          less-plugin. E.g. the clean css plugin is called less-plugin-clean-css
                          once installed (npm install less-plugin-clean-css), use either with
                          --plugin=less-plugin-clean-css or just --clean-css
                          specify options afterwards e.g. --plugin=less-plugin-clean-css="advanced"
                          or --clean-css="advanced"

------------------------- Deprecated ----------------
 --line-numbers=TYPE      Outputs filename and line numbers.
                          TYPE can be either 'comments', which will output
                          the debug info within comments, 'mediaquery'
                          that will output the information within a fake
                          media query which is compatible with the SASS
                          format, and 'all' which will do both.
 --verbose                Be verbose.
 -x, --compress           Compresses output by removing some whitespaces.
                          We recommend you use a dedicated minifer like less-plugin-clean-css