> ## Documentation Index
> Fetch the complete documentation index at: https://docs.uniwind.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# generate-artifacts

> Generate Uniwind artifacts from your CSS entry file

## Overview

The `generate-artifacts` command generates Uniwind artifacts from your CSS entry file.

Use it when you need to run artifact generation manually from a script or CI step.

This is useful in CI actions when you run tools that need generated Uniwind types before Metro or Vite starts, for example a linter or formatter for Tailwind classes.

## Basic Usage

```bash theme={null}
uniwind generate-artifacts --css ./global.css
```

Pass extra themes with repeated `--theme` flags and set the TypeScript declarations path with `--dts`:

```bash theme={null}
uniwind generate-artifacts --css ./global.css --theme premium --theme ocean --dts ./src/uniwind-types.d.ts
```

## Options

### --css

<ParamField path="--css" type="string" required>
  CSS entry file path, for example `./global.css`.
</ParamField>

This should point to the CSS file where you import Tailwind and Uniwind:

```css global.css theme={null}
@import 'tailwindcss';
@import 'uniwind';
```

### --theme

<ParamField path="--theme" type="string">
  Extra theme name. Pass this option multiple times to match the custom themes from `extraThemes`.
</ParamField>

```bash theme={null}
uniwind generate-artifacts --css ./global.css --theme premium --theme ocean
```

Define these themes in your Metro or Vite config with `extraThemes`:

```js metro.config.js theme={null}
module.exports = withUniwindConfig(config, {
  cssEntryFile: './global.css',
  extraThemes: ['premium', 'ocean'],
});
```

```ts vite.config.ts theme={null}
uniwind({
  cssEntryFile: './global.css',
  extraThemes: ['premium', 'ocean'],
})
```

### --dts

<ParamField path="--dts" type="string">
  Generated TypeScript declarations path.
</ParamField>

```bash theme={null}
uniwind generate-artifacts --css ./global.css --dts ./src/uniwind-types.d.ts
```

<Info>
  Place the `.d.ts` file in your `src` or `app` directory for automatic TypeScript inclusion. For custom paths outside these directories, add the file to your `tsconfig.json`.
</Info>

### --help

<ParamField path="--help" type="boolean">
  Show help for the command.
</ParamField>

```bash theme={null}
uniwind generate-artifacts --help
```

## Usage Reference

```bash theme={null}
uniwind generate-artifacts --css <file> [--theme <name>...] [--dts <file>]
```

## Related

<CardGroup cols={2}>
  <Card title="Metro Config" icon="train" href="/api/metro-config">
    Configure automatic artifact generation in Metro
  </Card>

  <Card title="Global CSS" icon="css3" href="/theming/global-css">
    Learn more about configuring your CSS entry file
  </Card>

  <Card title="Custom Themes" icon="swatchbook" href="/theming/custom-themes">
    Create and register extra themes
  </Card>
</CardGroup>