UnoCSS CLI

Giao diện dòng lệnh cho UnoCSS: @unocss/cli.

• 🍱 Phù hợp với các backend truyền thống như Laravel hoặc Kirby
• 👀 Chế độ xem được bao gồm
• 🔌 Hỗ trợ các cấu hình tùy chỉnh thông qua uno.config.ts

Cài đặt

Gói này được đi kèm với gói unocss:

pnpm

pnpm add -D unocss

yarn

yarn add -D unocss

npm

npm install -D unocss

bun

bun add -D unocss

Bạn cũng có thể cài đặt gói độc lập:

pnpm

pnpm add -D @unocss/cli

yarn

yarn add -D @unocss/cli

npm

npm install -D @unocss/cli

bun

bun add -D @unocss/cli

INFO

Nếu bạn không thể tìm thấy tệp thực thi (v.d. với pnpm và chỉ unocss được cài đặt), bạn sẽ cần cài đặt rõ ràng gói độc lập @unocss/cli.

Sử dụng

Bạn cũng có thể truyền nhiều mẫu glob cho @unocss/cli:

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

Ví dụ cấu hình gói:

INFO

Đảm bảo thêm các dấu ngoặc kép được thoát vào các mẫu glob script npm của bạn.

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

Phát triển

Thêm cờ --watch (hoặc -w) để bật theo dõi thay đổi tệp:

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

Sản xuất

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

uno.css cuối cùng sẽ được tạo vào thư mục hiện tại theo mặc định.

Tính năng tích hợp

Cấu hình

Tạo một tệp cấu hình uno.config.js hoặc uno.config.ts ở mức gốc dự án của bạn để tùy chỉnh UnoCSS.

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
}

Để biết danh sách các tùy chọn, hãy đến tài liệu các cấu hình UnoCSS.

Tùy chọn

Tùy chọn
-v, --version	Hiển thị phiên bản hiện tại của UnoCSS
-c, --config-file <file>	Tệp cấu hình
-o, --out-file <file>	Tên tệp đầu ra cho tệp UnoCSS được tạo. Mặc định là uno.css trong thư mục làm việc hiện tại
--stdout	Viết tệp UnoCSS được tạo vào STDOUT. Sẽ làm cho --watch và --out-file bị bỏ qua
-w, --watch	Cho biết các tệp được tìm thấy bởi mẫu glob nên được theo dõi
--preflights	Bật kiểu preflight
--write-transformed	Cập nhật các tệp nguồn với các tiện ích đã biến đổi
-m, --minify	Thu nhỏ CSS được tạo
-h, --help	Hiển thị các tùy chọn CLI có sẵn