@vte-js/cli

Vue Token Engine 的命令行工具。

安装

npm install -g @vte-js/cli
# 或
pnpm add -g @vte-js/cli

命令

vte validate

验证 token 定义文件。

vte validate design-tokens.ts

输出：

🔍 Validating tokens: ./design-tokens.ts

✅ Token validation passed!

   Total tokens: 11
   References: 4
   Primitives: 7

   Token tree:
   ├── 📁 primitive/
   │   ├── 📁 blue/
   │   │   ├── 📦 50
   │   │   └── 📦 500
   ...

vte extract

提取 token 路径列表。

# 列表格式
vte extract design-tokens.ts

# JSON 格式
vte extract design-tokens.ts --json

输出（列表格式）：

📋 Token paths (11 total):

  primitive/
    blue.50 = #eff6ff
    blue.500 = #3b82f6
  semantic/
    color.primary → primitive.blue.500
    spacing.small = 0.25rem

vte generate

生成平台特定的代码。

# 生成 Web CSS
vte generate design-tokens.ts --platform web

# 生成小程序代码
vte generate design-tokens.ts --platform mp

# 生成 React Native 代码
vte generate design-tokens.ts --platform rn

# 输出到文件
vte generate design-tokens.ts --platform web --output dist/tokens.css

输出（Web）：

/* Auto-generated by VTE CLI - DO NOT EDIT */

:root {
  --vte-primitive-blue-500: #3b82f6;
  --vte-semantic-color-primary: #3b82f6;
  --vte-semantic-spacing-medium: 0.5rem;
}

配置

默认查找当前目录下的 design-tokens.ts，可通过参数指定：

vte validate path/to/tokens.ts

License

ISC