首页
/ RECESS 技术文档

RECESS 技术文档

2024-12-28 22:39:28作者:尤峻淳Whitney

本文档旨在帮助用户安装、使用 RECESS 项目,并详细解释其 API 使用方法。

1. 安装指南

要安装 RECESS,您需要确保已经安装了 Node.js 和 npm(Node.js 包管理器)。

安装 RECESS 的命令如下:

$ npm install recess -g

该命令将 RECESS 安装为全局模块,使得您可以在任何位置使用它。

2. 项目使用说明

RECESS 是一个基于 LESS 构建的简单、吸引人的 CSS 代码质量工具。您可以将它作为代码检查工具集成到开发过程中,或者直接将其集成到构建系统中作为编译器使用。

命令行接口

RECESS 的基本命令行使用方式如下:

$ recess [path] [options]

选项

以下是 RECESS 支持的选项:

  • --compile: 编译您的代码并输出到终端,修复空白和排序。
  • --compress: 压缩编译后的代码。
  • --config: 接受一个路径,指定 JSON 配置对象。
  • --format <format>: 控制错误的输出格式。
    • --format text: 默认格式,显示错误和上下文。
    • --format compact: 每行显示一个错误,适用于 IDE 集成。
  • --noSummary: 不输出每个文件的摘要块。
  • --includePath: 接受一个额外的目录路径,用于查找 @import 的 LESS 文件。
  • --stripColors: 从输出中移除颜色(用于日志记录)。
  • --watch: 监听文件系统变化,适用于编译 Less 项目。
  • --noIDs: 不抱怨在样式表中使用 ID。
  • --noJSPrefix: 不抱怨样式 .js- 前缀的类名。
  • --noOverqualifying: 不抱怨过度限定选择器。
  • --noUnderscores: 不抱怨在类名中使用下划线。
  • --noUniversalSelectors: 不抱怨使用通用 * 选择器。
  • --prefixWhitespace: 在供应商前缀属性前添加空白。
  • --strictPropertyOrder: 不检查属性排序。
  • --zeroUnits: 如果值为 0,则不抱怨添加单位。

示例

  • 代码检查所有 CSS 文件:
$ recess *.css
  • 忽略 ID 样式检查:
$ recess ./bootstrap.css --noIds false
  • 使用紧凑输出和无颜色:
$ recess ./bootstrap.css --format compact --stripColors
  • 编译并压缩 .less 文件,然后输出到新文件:
$ recess ./bootstrap.less --compress > ./bootstrap-production.css
  • 监听目录变化并自动编译 CSS 文件:
$ recess input.less:ouput.css --watch watch/this/dir/for/changes
  • 监听单个文件变化并自动编译 CSS 文件:
$ recess input.less:ouput.css --watch

3. 项目 API 使用文档

RECESS 提供了一个简单的程序化 API。

var recess = require('recess')

在引入 RECESS 后,只需传递一个路径(或路径数组)和一个可选的选项对象以及一个可选的回调函数:

recess(['../fat.css', '../twitter.css'], { compile: true }, callback)

以下是程序化 API 可用的选项(及默认值):

  • compile: false
  • compress: false
  • includePath: []
  • noIDs: true
  • noJSPrefix: true
  • noOverqualifying: true
  • noUnderscores: true
  • noUniversalSelectors: true
  • prefixWhitespace: true
  • strictPropertyOrder: true
  • stripColors: false
  • zeroUnits: true

回调函数在处理每个输入完成时被触发。回调函数接收一个包含每个路径实例的数组。这些实例具有许多有用的属性,例如原始数据和输出字符串数组。

在编译时,通过输出属性访问编译后的源代码:

var recess = require('recess')

recess('./js/fat.css', { compile: true }, function (err, obj) {
  if (err) throw err
  console.log(
    obj // recess 实例 for fat.css
  , obj.output // 数组,包含可记录的内容
  , obj.errors // 数组,包含失败的检查规则
  )
})

4. 项目安装方式

RECESS 的安装方式已在“安装指南”中详细说明。使用 npm 命令全局安装即可。

登录后查看全文
热门项目推荐
相关项目推荐