https://github.com/b-palaniappan/svelte-app

Svelte Kit with Shadcn UI.
https://github.com/b-palaniappan/svelte-app

shadcn-ui svelte-kit

Last synced: 8 days ago
JSON representation

Svelte Kit with Shadcn UI.

• Host: GitHub
• URL: https://github.com/b-palaniappan/svelte-app
• Owner: b-palaniappan
• License: mit
• Created: 2024-04-08T02:45:43.000Z (7 months ago)
• Default Branch: main
• Last Pushed: 2024-04-09T04:31:56.000Z (7 months ago)
• Last Synced: 2024-04-10T04:46:44.603Z (7 months ago)
• Topics: shadcn-ui, svelte-kit
• Language: Svelte
• Homepage:
• Size: 285 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# create-svelte

Everything you need to build a Svelte project, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/main/packages/create-svelte).

## Creating a project

If you're seeing this, you've probably already done this step. Congrats!

```bash

# create a new project in the current directory

bun create svelte@latest

# create a new project in my-app

bun create svelte@latest my-app

```

## Developing

Once you've created a project and installed dependencies with `bun install` (or `pnpm install` or `yarn`), start a development server:

```bash

bun --bun run dev

# or start the server and open the app in a new browser tab

bun --bun run dev -- --open

```

## Building

To create a production version of your app:

```bash

bun run build

```

You can preview the production build with `npm run preview`.

> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.

## Project docs

### Adding shadcn components

- To add a new shadcn compoent, run `bunx shadcn-svelte@latest add  `. Example: `bunx shadcn-svelte@latest add button`.

- To update shadcn components, run `bunx shadcn-svelte@latest update`. This will update all shadcn components to the latest version.

### Adding fonts

- To add a new font from [fontsource](https://fontsource.org/), run `bun add @fontsource/poppins`.

- Then import the font in `src/app.pcss` like this: `import '@fontsource/poppins';`.

- Then add it to the css as, under `@layer base`.

```css

@font-face {

	font-family: 'Poppins', sans-serif;

	font-display: swap;

}

```