Skip to content

My custom sveltekit template, including tailwind, i18n, form handling and theme

Notifications You must be signed in to change notification settings

ThibaultAndreis/sveltekit-template

Repository files navigation

Custom Sveltekit template

This is my custom sveltekit template

It includes tailwind, i18n, dark theme management, superforms, pm2 and prettier v2.8 as v3 is broken

Creating a project

Git clone this project, then change the upstream repo to your own.

git clone git@github.com:ThibaultAndreis/sveltekit-template.git  ./<your project name>

cd <your project name>

git remote set-url <your project upstream url>

pnpm install

pnpm dev

Development

All styles tags should have the lang=postcss param

<style lang="postcss">
  /*
    Your style
  */
</style>

All script tags should have the lang=ts param

<script lang="ts">
  /*
    Your script
  */
</script>

Building

To create a production version of your app:

pnpm run build

Don't forget to change your application name in the package.json and ecosystem.json files

Currently, the template use the bun adapter and interpreter.

it can easily be changed to node :

//In svelte.config.js

import { vitePreprocess } from '@sveltejs/kit/vite';
- import adapter from 'svelte-adapter-bun';
+ import adapter from '@sveltejs/adapter-node';
/** @type {import('@sveltejs/kit').Config} */
const config = {
  preprocess: vitePreprocess(),

  kit: {
    adapter: adapter({
      precompress: true
    })
  }
};

export default config;
//In ecosystem.json
{
  "apps": [
  {
    "name": "project-name",
    - "interpreter": "bun",
    + "interpreter": "node",
    "env": {
      "NODE_ENV": "production",
      "PORT": "3000",
      "HOST": "127.0.0.1"
    },
    "script": "build/index.js",
    "log_date_format": "YYYY-MM-DD HH:mm:ss"
  }
]
}

About

My custom sveltekit template, including tailwind, i18n, form handling and theme

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published