Bless 项目技术文档

2024-12-23 14:10:14作者：董斯意

1. 安装指南

全局安装

要使用 Bless 的命令行工具，首先需要全局安装 Bless：

npm install -g bless

作为项目依赖安装

如果你希望在项目中使用 Bless 的 API，可以通过以下命令安装：

npm install bless

2. 项目的使用说明

Bless 是一个用于处理 CSS 文件的工具，主要用于解决 Internet Explorer 9 及以下版本中 CSS 选择器数量限制的问题。Bless 会分析 CSS 文件中的选择器数量，并将其拆分为多个文件，以确保每个文件的选择器数量不超过 IE 的限制。

命令行工具

Bless 提供了两个主要的命令行工具：

count：检查 CSS 文件中的选择器数量，如果超过 IE 的限制则会失败。
chunk：将 CSS 文件拆分为多个文件，以避免选择器数量超过 IE 的限制。

示例

检查 CSS 文件的选择器数量：
```
blessc count <file|directory>
```
将 CSS 文件拆分为多个文件：
```
blessc chunk <file|directory>
```

将拆分后的文件输出到指定目录：

blessc chunk <file|directory> --out-dir <output directory>

生成源映射文件：

blessc chunk <file|directory> --sourcemaps

3. 项目 API 使用文档

`chunk(cssString, [options])`

该方法用于将 CSS 字符串拆分为多个块，以便在 IE 中使用。

参数

cssString：要处理的 CSS 字符串。
options：可选参数对象。
- source：CSS 文件的路径。
- sourceMaps：是否生成源映射文件（默认为 false）。

返回值

data：包含每个 CSS 块的字符串数组。
maps：包含每个 CSS 块的源映射字符串数组（如果未提供 source 或 sourceMaps 为 false，则为空数组）。
totalSelectorCount：提供的 CSS 文件中选择器的总数。

示例

var parsedData = chunk(code, { source: './path/to/css.css' });
parsedCss.data;                  // 包含每个 CSS 块的字符串数组
parsedCss.maps;                  // 包含每个 CSS 块的源映射字符串数组
parsedCss.totalSelectorCount;    // 提供的 CSS 文件中选择器的总数

`chunkFile(filepath, options)`

该方法用于将指定的 CSS 文件拆分为多个块。

参数

filepath：要处理的 CSS 文件路径。
options：可选参数对象。
- sourcemaps：是否生成源映射文件（默认为 false）。

返回值

一个 Promise 对象，解析为包含拆分数据的相同属性。

示例

chunkfile('./path/to/css.css').then(function(parsedCss, { sourcemaps: true }) {
  parsedCss.data;                  // 包含每个 CSS 块的字符串数组
  parsedCss.maps;                  // 包含每个 CSS 块的源映射字符串数组
  parsedCss.totalSelectorCount;    // 提供的 CSS 文件中选择器的总数
});