Skip to content

CLI

La interfaz de línea de comandos para UnoCSS: @unocss/cli.

  • 🍱 Adecuado para backends tradicionales como Laravel o Kirby
  • 👀 Modo watch incluido
  • 🔌 Soporta configuraciones personalizadas a través de uno.config.ts

Instalación

Este paquete viene incluido con el paquete unocss:

bash
pnpm add -D unocss
bash
yarn add -D unocss
bash
npm install -D unocss
bash
bun add -D unocss

También puedes instalar el paquete independiente:

bash
pnpm add -D @unocss/cli
bash
yarn add -D @unocss/cli
bash
npm install -D @unocss/cli
bash
bun add -D @unocss/cli

INFO

Si no puedes encontrar el binario (ej. con pnpm y solo unocss está instalado), necesitarás instalar explícitamente el paquete independiente @unocss/cli.

Uso

También puedes pasar múltiples patrones glob a @unocss/cli:

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

Ejemplo de configuración de paquete:

INFO

Asegúrate de agregar comillas escapadas a tus patrones glob de script npm.

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

Desarrollo

Agrega la bandera --watch (o -w) para habilitar la observación de cambios de archivos:

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

Producción

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

El uno.css final se generará en el directorio actual por defecto.

Características integradas

Configuraciones

Crea un archivo de configuración uno.config.js o uno.config.ts en el nivel raíz de tu proyecto para personalizar UnoCSS.

ts
import { defineConfig } from 'unocss'

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

interface CliEntryItem {
  /**
   * Patrones glob para hacer coincidir archivos
   */
  patterns: string[]
  /**
   * El nombre del archivo de salida para el archivo UnoCSS generado
   */
  outFile: string
}

Para una lista de opciones, consulta la documentación de configuraciones de UnoCSS.

Opciones

Opciones
-v, --versionMostrar la versión actual de UnoCSS
-c, --config-file <file>Archivo de configuración
-o, --out-file <file>El nombre del archivo de salida para el archivo UnoCSS generado. Por defecto es uno.css en el directorio de trabajo actual
--stdoutEscribir el archivo UnoCSS generado a STDOUT. Causará que --watch y --out-file sean ignorados
-w, --watchIndica si los archivos encontrados por el patrón glob deben ser observados
--preflightsHabilitar estilos de preflight
--write-transformedActualizar archivos fuente con utilidades transformadas
-m, --minifyMinificar CSS generado
-h, --helpMostrar opciones CLI disponibles

Released under the MIT License.