Less的命令行界面


本文作者: jsweibo

本文链接: https://jsweibo.github.io/2019/08/28/Less%E7%9A%84%E5%91%BD%E4%BB%A4%E8%A1%8C%E7%95%8C%E9%9D%A2/

摘要

本文主要讲述了:

  1. 基础用法
  2. 参数

正文

基础用法

示例:将foo.less编译到标准输出

1
2
3
#!/usr/bin/env bash

npx lessc foo.less

示例:将foo.less编译到foo.css

1
2
3
#!/usr/bin/env bash

npx lessc foo.less foo.css

参数

–version

查看 lessc 的版本号

1
2
3
#!/usr/bin/env bash

npx lessc --version

–help

查看 lessc 的帮助文档

1
2
3
#!/usr/bin/env bash

npx lessc --help

–source-map

编译为 CSS 时生成 sourcemap 文件

示例:

1
2
3
#!/usr/bin/env bash

npx lessc --source-map foo.less foo.css

–rootpath

--rootpath用于指定编译后 CSS 文件中@importurl()中的根路径

--rootpath既可以是本地地址,也可以是 URL。

示例:

源文件:

foo.less

1
2
3
4
@import 'style.css';
body {
background-image: url('foo.png');
}

编译:

1
2
3
#!/usr/bin/env bash

npx lessc --rootpath=https://google.com foo.less foo.css

输出:

1
2
3
4
@import 'https://google.com/style.css';
body {
background-image: url('https://google.com/foo.png');
}

参考资料

本文作者: jsweibo

本文链接: https://jsweibo.github.io/2019/08/28/Less%E7%9A%84%E5%91%BD%E4%BB%A4%E8%A1%8C%E7%95%8C%E9%9D%A2/


本文对你有帮助?请支持我


支付宝
微信