This project includes my preferred setup for building a Sveltekit project, this includes the following libraries:
- Sveltekit - configured with Typescript, a standard create-app built from
sv create app
- Prettier - syntax formatting, with my preferred configuration in
.prettierrc
- Eslint - linting for obvious syntax errors
- Shadcn + Tailwind - components and CSS
- Docker scripts + Postgres - if database is needed scripts available to run Postgres
- lucide-svelte - icon library
- mode-watcher - used for dark/light mode switching
- svelte-sonner - used to create toasts throughout the application
- Prisma + Postgres - If storage is needed this comes with scripts to run a local Postgres container and setup prisma to use it
By default this does not setup the database connections, if you need these then please update the hooks.server.ts to configure Prisma (un-comment lines). You can also update the yarn dev
script to run yarn db
before startup to make sure the local DB is configured.
This project comes with a few scripts to be aware of:
npx dev
- used to run Vite - by default services will be running on port 10001npx build
- used to prepare a production build, which can then be deployed as desirednpx db
- used to setup the database if it is needed, you will also need to edit thesrc/hooks.server.ts
and un-comment the prisma componentsnpx preview
- used to serve the built solution, without the hot reloading capabilities of vitenpx check
- checks svelte-kit configurationnpx check:watch
- same as check, but watchesnpx lint
- checks with prettier and eslint for syntax formatting and errorsnpx format
- uses prettier to run the formatter, this will update files
Shadcn components can be found at: https://www.shadcn-svelte.com/docs/components
Components can be added with: npx shadcn-svelte@latest add <component>