CLI

UnoCSS 的命令行接口：@unocss/cli。

¥The command line interface for UnoCSS: @unocss/cli.

• 🍱 适合 Laravel 或 Kirby 等传统后端

  ¥🍱 Suited for traditional backends like Laravel or Kirby

• 👀 包括 监视模式

  ¥👀 Watch mode included

• 🔌 支持通过 uno.config.ts 进行自定义配置

  ¥🔌 Supports custom configurations via uno.config.ts

安装

¥Installation

该软件包随 unocss 软件包一起提供：

¥This package is shipped with the unocss package:

pnpm

pnpm add -D unocss

yarn

yarn add -D unocss

npm

npm install -D unocss

bun

bun add -D unocss

你还可以安装独立包：

¥You can also install the standalone package:

pnpm

pnpm add -D @unocss/cli

yarn

yarn add -D @unocss/cli

npm

npm install -D @unocss/cli

bun

bun add -D @unocss/cli

信息

如果你无法找到二进制文件（例如，使用 pnpm 并且仅安装了 unocss），则需要显式安装 @unocss/cli 独立包。

¥If you are not able to find the binary (e.g. with pnpm and only unocss is installed), you'll need to explicit install @unocss/cli standalone package.

用法

¥Usage

你还可以将多个 glob 模式传递给 @unocss/cli：

¥You can also pass multiple glob patterns to @unocss/cli:

unocss "site/snippets/**/*.php" "site/templates/**/*.php"

包配置示例：

¥Example package configuration:

信息

确保将转义引号添加到你的 npm 脚本 glob 模式中。

¥Make sure to add escaped quotes to your npm script glob patterns.

package.json

{
  "scripts": {
    "dev": "unocss \"site/{snippets,templates}/**/*.php\" --watch",
    "build": "unocss \"site/{snippets,templates}/**/*.php\""
  },
  "devDependencies": {
    "@unocss/cli": "latest"
  }
}

开发

¥Development

添加 --watch（或 -w）标志以启用监视文件更改：

¥Add the --watch (or -w) flag to enable watching for file changes:

unocss "site/{snippets,templates}/**/*.php" --watch

生产

¥Production

unocss "site/{snippets,templates}/**/*.php"

最终的 uno.css 会默认生成到当前目录。

¥The final uno.css will be generated to the current directory by default.

内置功能

¥Built-in features

配置

¥Configurations

在项目的根级别创建 uno.config.js 或 uno.config.ts 配置文件以自定义 UnoCSS。

¥Create a uno.config.js or uno.config.ts configuration file the root-level of your project to customize UnoCSS.

uno.config.ts

import { defineConfig } from 'unocss'

export default defineConfig({
  cli: {
    entry: {}, // CliEntryItem | CliEntryItem[]
  },
  // ...
})

interface CliEntryItem {
  /**

   * Glob patterns to match files
   */
  patterns: string[]
  /**

   * The output filename for the generated UnoCSS file
   */
  outFile: string
}

有关选项列表，请访问 UnoCSS 配置 文档。

¥For a list of options, head over to the UnoCSS configurations docs.

选项

¥Options

选项
-v, --version	显示 UnoCSS 当前版本
-c, --config-file <file>	配置文件
-o, --out-file <file>	生成的 UnoCSS 文件的输出文件名。默认为当前工作目录中的 uno.css
--stdout	将生成的 UnoCSS 文件写入 STDOUT。会导致 --watch 和 --out-file 被忽略
-w, --watch	指示是否应监视 glob 模式找到的文件
--preflights	启用预检样式
--write-transformed	使用转换后的工具更新源文件
-m, --minify	缩小生成的 CSS
-h, --help	显示可用的 CLI 选项