Sveltekit Template

A Sveltekit project template with Tailwind and Prettier setup.

New project

  1. Clone the repo and delete the lock file (if present):
git clone https://github.com/PaulioRandall/template-sveltekit.git
cd template-sveltekit
rm -f package-lock.json
  1. Update project name in package.json with your project name.

  2. Install Node v14. Awaiting support from cloud providers to upgrade to Node v16.

  3. Install, build, and run:

npm i
npm run build
npm run dev
  1. Enjoy at localhost:3000

Stuck or curious

Format code?

npm run fmt

Modify .prettierrc.json to customise styling.

Permission denied?

sh: 1: ./scripts/build-env.sh: Permission denied

If you get a permissions error like the one above then you'll just need to give yourself permissions to execute the file:

chmod 744 ./scripts/build-env.sh

Environment variables?

All environment variables must be prefixed with VITE_ or they won't be accessible by Sveltekit.

At the start of a build ./scripts/build-env.sh is run that generates a .env file in the root of the project. This file is ignored by Git. Modify the script not the resultant file to add new variables.

To rebuild this file without rebuilding the project use:

npm run prebuild

Build warnings

Don't worry if you receive build warnings such as the one below. I get them too. As far as I've researched, they are safe to ignore: stackoverflow

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: ...

Top categories

svelte logo

Need a Svelte website built?

Hire a professional Svelte developer today.
Loading Svelte Themes