Style Dictionary CLI 使用指南：从入门到精通-优快云博客

本文链接：https://blog.youkuaiyun.com/gitblog_01126/article/details/148548760

Style Dictionary CLI 使用指南：从入门到精通

style-dictionary A build system for creating cross-platform styles. 项目地址: https://gitcode.com/gh_mirrors/st/style-dictionary

什么是 Style Dictionary CLI

Style Dictionary 是一个强大的设计令牌管理工具，而它的命令行界面(CLI)则是开发者与这个工具交互的主要方式。CLI 提供了一套完整的命令系统，允许开发者创建、构建和管理设计系统。

安装方式

全局安装（推荐初学者）

对于刚开始接触 Style Dictionary 的开发者，建议使用全局安装方式：

npm install -g style-dictionary

这种方式允许你在任何目录下直接使用 style-dictionary 命令。

项目本地安装（推荐团队协作）

在实际项目开发中，更推荐将 Style Dictionary 作为开发依赖安装：

npm install --save-dev style-dictionary

然后在 package.json 中添加构建脚本：

{
  "scripts": {
    "build-tokens": "style-dictionary build"
  }
}

这样做的优势是：

确保团队成员使用相同版本的 Style Dictionary
避免全局依赖冲突
便于 CI/CD 流程集成

核心命令详解

1. build 命令

build 是 Style Dictionary 最常用的命令，它根据配置文件将设计令牌转换为各种平台可用的代码。

style-dictionary build [options]

常用选项说明：

-c, --config <path>：指定配置文件路径（默认为 ./config.json）
-p, --platform <platform>：仅构建指定平台（不指定则构建所有平台）
-s, --silent：静默模式（仅显示致命错误）
-v, --verbose：详细模式（显示引用错误、令牌冲突等详细信息）
-n, --no-warn：禁用警告信息

使用场景示例：

# 使用自定义配置文件构建
style-dictionary build --config ./my-config.json

# 仅构建 iOS 平台
style-dictionary build --platform ios

# 静默构建（适合 CI 环境）
style-dictionary build --silent

2. clean 命令

clean 命令用于清理之前构建生成的文件，保持项目整洁。

style-dictionary clean [options]

选项与 build 命令相同，可以针对特定平台进行清理。

3. init 命令

init 命令帮助快速生成项目模板，非常适合初学者。

style-dictionary init <example-type>

支持两种模板类型：

basic：基础模板，包含最小配置
complete：完整模板，展示所有功能

4. version 命令

查看当前安装的 Style Dictionary 版本：

style-dictionary --version

最佳实践建议

配置文件管理：建议将配置文件命名为 style-dictionary.config.js 而不是默认的 config.json，这样可以支持更复杂的 JavaScript 配置。
平台特定构建：在大型项目中，使用 --platform 选项可以显著提高构建速度。
日志控制：
- 开发阶段使用 --verbose 获取详细日志
- 生产环境使用 --silent 减少日志输出
版本控制：建议将生成的代码文件（非令牌源文件）添加到 .gitignore 中。
CI/CD 集成：在持续集成环境中，使用 --no-warn 可以减少日志噪音。