mirror of
https://github.com/huntabyte/shadcn-svelte.git
synced 2026-09-14 19:33:46 +08:00
CokaKoala
157 lines
5.0 KiB
Markdown
157 lines
5.0 KiB
Markdown
---
|
||
title: shadcn-svelte
|
||
description: Use the shadcn-svelte CLI to add components to your project.
|
||
---
|
||
|
||
<script>
|
||
import PMExecute from "$lib/components/pm-execute.svelte";
|
||
</script>
|
||
|
||
## init
|
||
|
||
Use the `init` command to initialize dependencies for a new project.
|
||
|
||
The `init` command installs dependencies, adds the `cn` util, and creates CSS variables for the project.
|
||
|
||
<PMExecute command="shadcn-svelte@latest init" />
|
||
|
||
You will be asked a few questions to configure `components.json`:
|
||
|
||
```txt showLineNumbers
|
||
Which base color would you like to use? › Slate
|
||
Where is your global CSS file? (this file will be overwritten) › src/routes/layout.css
|
||
Configure the import alias for lib: › $lib
|
||
Configure the import alias for components: › $lib/components
|
||
Configure the import alias for utils: › $lib/utils
|
||
Configure the import alias for hooks: › $lib/hooks
|
||
Configure the import alias for ui: › $lib/components/ui
|
||
```
|
||
|
||
**Options**
|
||
|
||
```bash
|
||
Usage: shadcn-svelte init [options]
|
||
|
||
initialize your project and install dependencies
|
||
|
||
Options:
|
||
--preset <preset> the preset to use
|
||
-c, --cwd <path> the working directory
|
||
--no-deps-install add dependencies to package.json without running install
|
||
--skip-preflight ignore preflight checks and continue (default: false)
|
||
--reinstall reinstall existing components when style changes
|
||
--no-reinstall skip reinstalling existing components when style changes
|
||
--base-color <name> the base color for the components (choices: "neutral", "stone", "zinc", "mauve", "olive", "mist", "taupe")
|
||
--css <path> path to the global CSS file
|
||
--components-alias <path> import alias for components
|
||
--lib-alias <path> import alias for lib
|
||
--utils-alias <path> import alias for utils
|
||
--hooks-alias <path> import alias for hooks
|
||
--ui-alias <path> import alias for ui
|
||
--proxy <proxy> fetch items from registry using a proxy
|
||
-h, --help display help for command
|
||
```
|
||
|
||
---
|
||
|
||
## add
|
||
|
||
Use the `add` command to add components and dependencies to your project.
|
||
|
||
<PMExecute command="shadcn-svelte@latest add [component]" />
|
||
|
||
**Options**
|
||
|
||
```bash
|
||
Usage: shadcn-svelte add [options] [components...]
|
||
|
||
add components to your project
|
||
|
||
Arguments:
|
||
components the components to add or a url to the component
|
||
|
||
Options:
|
||
-c, --cwd <path> the working directory (default: the current directory)
|
||
--no-deps-install add dependencies to package.json without running install
|
||
--skip-preflight ignore preflight checks and continue (default: false)
|
||
-a, --all install all components to your project (default: false)
|
||
-y, --yes skip confirmation prompt (default: false)
|
||
-o, --overwrite overwrite existing files (default: false)
|
||
--proxy <proxy> fetch components from registry using a proxy
|
||
-h, --help display help for command
|
||
```
|
||
|
||
---
|
||
|
||
## apply
|
||
|
||
Use the `apply` command to apply a preset to an existing project.
|
||
|
||
<PMExecute command="shadcn-svelte@latest apply a2r6bw" />
|
||
|
||
You can apply only the theme or fonts from a preset without reinstalling UI components:
|
||
|
||
<PMExecute command="shadcn-svelte@latest apply a2r6bw --only theme" />
|
||
|
||
Supported values for `--only` are `theme` and `font`.
|
||
|
||
**Options**
|
||
|
||
```bash
|
||
Usage: shadcn-svelte apply [options]
|
||
|
||
apply a preset to an existing project
|
||
|
||
Arguments:
|
||
preset the preset to apply
|
||
|
||
Options:
|
||
--preset <preset> the preset to apply
|
||
--only [parts] apply only parts of a preset: theme, font
|
||
-c, --cwd <path> the working directory (default: the current directory)
|
||
-y, --yes overwrite existing files without confirmation (default: false)
|
||
-s, --silent mute output (default: false)
|
||
--no-deps-install add dependencies to package.json without running install
|
||
--skip-preflight ignore preflight checks and continue (default: false)
|
||
--proxy <proxy> fetch items from registry using a proxy
|
||
-h, --help display help for command
|
||
```
|
||
|
||
---
|
||
|
||
## registry build
|
||
|
||
Use the `registry build` command to generate the registry JSON files.
|
||
|
||
<PMExecute command="shadcn-svelte@latest registry build [registry.json]" />
|
||
|
||
This command reads the `registry.json` file and generates the registry JSON files into the `static/r` directory.
|
||
|
||
**Options**
|
||
|
||
```bash
|
||
Usage: shadcn-svelte registry build [options] [registry]
|
||
|
||
build components for a shadcn-svelte registry
|
||
|
||
Arguments:
|
||
registry path to registry.json file (default: ./registry.json)
|
||
|
||
Options:
|
||
-c, --cwd <path> the working directory (default: the current directory)
|
||
-o, --output <path> destination directory for json files (default: ./static/r)
|
||
-h, --help display help for command
|
||
```
|
||
|
||
---
|
||
|
||
## Outgoing Requests
|
||
|
||
### Proxy
|
||
|
||
This enables the use of a proxy when sending out requests to fetch from the `shadcn-svelte` registry. If the `HTTP_PROXY` or `http_proxy` environment variables have been set, the request library underneath will respect the proxy settings.
|
||
|
||
```bash
|
||
HTTP_PROXY="<proxy-url>" npx shadcn-svelte@latest init
|
||
```
|