Edit the markdown source for "less-options"
" target="_blank" data-original-title="" title="">
跨平台选项
包含路径
|
|
lessc --include-path=PATH1;PATH2 |
{ paths: ['PATH1', 'PATH2'] } |
如果@import
规则中的文件不存在于该确切位置,则Less会在传递给此选项的位置处查找该文件。例如,您可以使用它来指定要在Less文件中相对简单地引用的库的路径。
根路径
|
|
lessc -rp=resources/
lessc --rootpath=resources/ |
{ rootpath: 'resources/' } |
允许您为CSS中每个生成的导入和url添加路径。这不会影响处理的Less导入语句,而不会影响输出CSS中剩余的语句。
例如,如果css使用的所有图像都在名为resources的文件夹中,则可以使用此选项将其添加到URL上,然后使该文件夹的名称可配置。
改写URL
|
|
lessc -ru=off
lessc --rewrite-urls=off |
{ rewriteUrls: 'off' } |
lessc -ru=all
lessc --rewrite-urls=all |
{ rewriteUrls: 'all' } |
lessc -ru=local
lessc --rewrite-urls=local |
{ rewriteUrls: 'local' } |
默认情况下,URL保持原样(off
),因此,如果将文件导入引用图像的子目录中,则CSS中将输出完全相同的URL。此选项允许您重写导入文件中的URL,以便该URL始终相对于已传递给Less的基础文件。例如
@import "global/fonts.less";
@font-face {
font-family: 'MyFont';
src: url('myfont/myfont.woff2') format('woff2');
}
没有设置或设置为rewriteUrls: 'off'
,编译main.less
将输出:
@font-face {
font-family: 'MyFont';
src: url('myfont/myfont.woff2') format('woff2');
}
使用rewriteUrls: 'all'
,将输出:
@font-face {
font-family: 'MyFont';
src: url('./global/myfont/myfont.woff2') format('woff2');
}
使用rewriteUrls: 'local'
,它将仅重写显式相对的URL(以开头的URL .
):
url('./myfont/myfont.woff2') url('./global/myfont/myfont.woff2')
url('myfont/myfont.woff2') url('myfont/myfont.woff2')
如果您要将Less与使用类似解析语义(如Node.js)的CSS模块组合在一起,这将很有用。
您可能还需要考虑使用data-uri函数而不是此选项,该功能会将图像嵌入到CSS中。
数学
发布了v3.7.0
|
|
lessc -m=[option]
lessc --math=[option] |
{ math: '[option]' } |
Less重建了数学选项,以在先前strictMath
设置(始终需要加括号)和默认设置(在所有情况下都执行数学运算)之间提供中间功能。
为了减少与CSS的冲突,CSS现在/
在值之间广泛使用符号,现在存在一种数学模式,该模式只需要用括号进行除法即可。尽管支持传统行为,但“严格数学”也已进行了调整,使操作更直观。
适用于的选项为math
:
always
(当前默认设置)-较少进行数学运算
parens-division
(未来的默认设置) -使用/
运算符不会在parens外部执行除法操作(但可以在使用运算符的parens之外“强制” 除法./
)
parens
| strict
-更直观的遗产形式strictMath: true
strict-legacy
(已弃用)-就像命名的一样,其运行方式与current完全相同strictMath: true
,不同的是width: -(1);
(现在,输出(parens中的单个尺寸值)width: -1;
与width: -(1)
总是
示例:
.math {
a: 1 + 1;
b: 2px / 2;
c: 2px ./ 2;
d: (2px / 2);
}
输出:
.math {
a: 2;
b: 1px;
c: 1px;
d: 1px;
}
分区
例:
.math {
a: 1 + 1;
b: 2px / 2;
c: 2px ./ 2;
d: (2px / 2);
}
输出:
.math {
a: 2;
b: 2px / 2;
c: 1px;
d: 1px;
}
严格
.math {
a: 1 + 1;
b: 2px / 2;
c: (2px / 2) + (3px / 1);
}
输出:
.math {
a: 1 + 1;
b: 2px / 2;
c: 1px + 3px;
}
严格遗产
在传统strictMath
模式下,括号外的混合表达式表示将不计算整个括号。(可能不是您想要的。)
.math {
a: 1 + 1;
b: 2px / 2;
c: (2px / 2) + (3px / 1);
}
输出:
.math {
a: 1 + 1;
b: 2px / 2;
c: (2px / 2) + (3px / 1);
}
严格数学(不建议使用)
该math
选项已替换为该选项。
相对网址(不建议使用)
|
|
lessc -ru
lessc --relative-urls |
{ relativeUrls: true } |
已替换为 rewriteUrls: "all"
严格的单位
|
|
lessc -su=on
lessc --strict-units=on |
{ strictUnits: true } |
默认为关闭/错误。
如果没有此选项,则在进行数学运算时,较少尝试猜测输出单元。例如
.class {
property: 1px * 2px;
}
在这种情况下,事情显然是不正确的-长度乘以长度会得到一个面积,但是css不支持指定面积。因此,我们假设用户将其中一个值表示为一个值,而不是长度单位,然后输出2px
。
启用严格的单位,我们假设这是计算中的错误并抛出错误。
IE8兼容性(已弃用)
|
|
lessc --ie-compat |
{ ieCompat: true } |
从v3.0.0开始默认为False。当前仅用于data-uri函数,以确保未创建太大的图像以供浏览器处理。
启用内联JavaScript(不建议使用)
|
|
lessc --js |
{ javascriptEnabled: true } |
从v3.0.0开始默认为False。启用.less
文件中JavaScript内联的评估。这为某些不希望样式表的用户输入包含可执行代码的开发人员带来了安全问题。
替换为该@plugin
选项。
全局变量
|
|
lessc --global-var="color1=red" |
{ globalVars: { color1: 'red' } } |
此选项定义文件可以引用的变量。实际上,该声明放置在基本Less文件的顶部,这意味着可以使用该声明,但是如果在文件中定义了此变量,也可以覆盖该声明。
修改变量
|
|
lessc --modify-var="color1=red" |
{ modifyVars: { color1: 'red' } } |
与全局变量选项相反,这会将声明放在基本文件的末尾,这意味着它将覆盖Less文件中定义的所有内容。
网址参数
|
|
lessc --url-args="cache726357" |
{ urlArgs: 'cache726357' } |
此选项使您可以指定一个参数,以继续每个URL。例如,这可用于缓存清除。
行号(已弃用)
|
|
lessc --line-numbers=comments
lessc --line-numbers=mediaquery
lessc --line-numbers=all |
{ dumpLineNumbers: 'comments' } |
生成内联源映射。这是浏览器开始支持源地图之前的唯一选项。
预装插件
请参阅:预加载插件
皮棉
|
|
lessc --lint -l |
{ lint: true } |
运行较少的解析器,并且仅报告错误而没有任何输出。
压缩(不建议使用)
|
|
lessc --compress -x |
{ compress: true } |
使用较少的内置压缩进行压缩。这做得不错,但是并没有利用专用CSS压缩的所有技巧。通常,我们建议您在Less转换为CSS后,使用第三方工具来清理和压缩CSS。
允许从不安全的HTTPS主机导入
|
|
lessc --insecure |
{ insecure: true } |
源地图选项
这些选项中的大多数不适用于在浏览器中使用Less.js,因为您应该使用预编译的Less文件生成源映射。
生成源地图
|
|
lessc --source-map |
{ sourceMap: {} } |
告诉更少生成一个源映射。
源映射输出文件名
|
|
lessc --source-map=file.map |
{ sourceMap: { outputFilename: 'file.map' } } |
源图根路径
|
|
lessc --source-map-rootpath=dev-files/ |
{ sourceMap: { sourceMapRootpath: 'dev-files/' } } |
指定一个根路径,该根路径应附加到源映射内的每个较少的文件路径以及输出CSS中指定的映射文件的路径。
因为基本路径默认为少输入文件的目录,所以根路径默认为从源映射输出文件到少输入文件的基本目录的路径。
例如,如果您在Web服务器的根目录中生成了一个css文件,但源less / css / map文件位于另一个文件夹中,则使用此选项。因此,对于以上选项,您可能有
output.css
dev-files/output.map
dev-files/main.less
源图基本路径
|
|
lessc --source-map-basepath=less-files/ |
{ sourceMap: { sourceMapBasepath: 'less-files/' } } |
这与rootpath选项相反,它指定应从输出路径中删除的路径。例如,如果要在less-files目录中编译文件,但是源文件将在Web服务器上的根目录或当前目录中可用,则可以指定此项以删除less-files
路径的其他部分。
它默认为少输入文件的路径。
在源图中包含较少的源
|
|
lessc --source-map-include-source |
{ sourceMap: { outputSourceFiles: true } } |
此选项指定我们应将所有Less文件都包含在源图中。这意味着您只需要地图文件即可到达原始源。
可以将其与map inline选项结合使用,因此您根本不需要任何其他外部文件。
源地图内联地图
|
|
lessc --source-map-inline |
{ sourceMap: { sourceMapFileInline: true } } |
此选项指定映射文件应在输出CSS中内联。不建议在生产环境中使用它,但在开发过程中,它允许编译器生成一个输出文件,该文件在支持它的浏览器中使用已编译的CSS,但向您显示未编译的较少源代码。
源地图URL
|
|
lessc --source-map-url=../my-map.json |
{ sourceMap: { sourceMapURL: '../my-map.json' } } |
允许您覆盖css中指向地图文件的URL。这是针对rootpath和basepath选项未完全产生所需内容的情况。