13x1/svelte-template

My personal template for Svelte/SvelteKit projects

svelte-template

This is my personal template for Svelte/SvelteKit projects. It is very opinionated and might not be your taste, but feel free to fork it and make it your own :3

Features

• Framework: Svelte & SvelteKit
• Language: TypeScript
• Linter: ESLint
• Formatter: Prettier
• Unit testing: Vitest
• E2E testing: Playwright
• Inline CSS: TailwindCSS & Typography
• CSS preprocessor: PostCSS & Autoprefixer
• CSS language: Sass/SCSS
• Env vars: SvelteKit's $env
• i18n: typesafe-i18n + a custom SSR-compatible adapter

Command to use

echo -n 'Project name: '
read project_name
git clone https://github.com/13x1/svelte-template.git $project_name
cd $project_name
git remote rename origin template
sed -i "s/svelte-template/$project_name/g" package*.json
rm README.md
echo -e "# $project_name\n\nInitialized with
[svelte-template](https://github.com/13x1/svelte-template)" > README.md
npm install
git add -A
git commit -m "Use template for $project_name"

Or, if you already cloned the template:

project_name=$(basename $(pwd))
git remote add template https://github.com/13x1/svelte-template
sed -i "s/svelte-template/$project_name/g" package*.json
rm README.md
echo -e "# $project_name\n\nInitialized with
[svelte-template](https://github.com/13x1/svelte-template)" > README.md
npm install
git add -A
git commit -m "Use template for $project_name"

svelte-template's Issues

better clientside error handling

a) load functions dont actually show the error:

https://github.com/13x1/svelte-template/blob/main/src/hooks.client.ts#L10

b) no runtime error handling

postcss doesnt have a config

when using tailwind classes:

[svelte-preprocess] PostCSS configuration was not passed or is invalid. If you expect to load it from a file make sure to install "postcss-load-config" and try again.

Error: No PostCSS Config found in: /home/lexi/git/ccc-demo