首页
/ Clean-CSS 技术文档

Clean-CSS 技术文档

2024-12-24 20:41:55作者:董灵辛Dennis

1. 安装指南

环境要求

  • Node.js 版本: 10.0 及以上

安装步骤

  1. 打开终端或命令行工具。
  2. 运行以下命令安装 clean-css
    npm install --save-dev clean-css
    

2. 项目的使用说明

基本使用

clean-css 是一个用于优化 CSS 文件的工具,能够有效减少 CSS 文件的大小并提高加载速度。以下是一个简单的使用示例:

var CleanCSS = require('clean-css');
var input = 'a{font-weight:bold;}';
var options = { /* 选项 */ };
var output = new CleanCSS(options).minify(input);

版本更新

  • 5.3 版本新增功能: 支持通过 variableValueOptimizers 选项优化变量值。
  • 5.0 版本重大变更: 不再支持 Node.js 6.x 和 8.x,移除了 transform 回调,默认的 Internet Explorer 兼容性从 10+ 改为 >11。
  • 4.2 版本新增功能: 新增 process 方法,支持 transition 属性优化,允许在特定注释块内保留 CSS 内容。
  • 4.1 版本新增功能: 新增 inline: false 选项,支持 multiplePseudoMerging 兼容性标志,新增 removeEmpty 标志。

3. 项目 API 使用文档

构造函数选项

clean-css 构造函数接受一个包含以下选项的参数:

  • compatibility: 控制兼容性模式,默认为 ie10+
  • fetch: 控制处理远程请求的函数。
  • format: 控制输出 CSS 格式,默认为 false
  • inline: 控制 @import 内联规则,默认为 'local'

优化级别

clean-css 支持多种优化级别:

  • Level 0: 基本优化。
  • Level 1: 中级优化,包括变量值优化、选择器排序等。
  • Level 2: 高级优化,包括合并规则、移除空规则等。

插件

从 5.0 版本开始,clean-css 引入了插件接口,允许用户自定义优化规则。

Minify 方法

minify 方法是 clean-css 的核心方法,用于压缩 CSS 代码。

Promise 接口

clean-css 支持 Promise 接口,方便异步操作。

CLI 工具

clean-css 提供了一个命令行工具,可以直接在终端中使用。

4. 项目安装方式

通过 npm 安装

npm install --save-dev clean-css

通过 yarn 安装

yarn add --dev clean-css

全局安装

npm install -g clean-css

通过以上步骤,您可以轻松安装并使用 clean-css 来优化您的 CSS 文件。

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