Creating a New Svelte Application.
Option 1 - Initialise with Vite via the Svelte option
This is currently the recommended approach to create a new svelte application alongside the Vite toolset for front-end development.
Run the following command and select the svelte option (or svelte-ts if you would prefer to use typescript):
npm init vite
The resulting output will look something like:
√ Project name: ... vite-project √ Select a framework: » svelte √ Select a variant: » svelte-ts Scaffolding project in D:\projects\vite-project... Done. Now run: cd vite-project npm install npm run dev
Vite is a very powerful set of modern build tools with very efficient HMR (Hot Module Replacement).
Option 2 - Initialise with SvelteKit (currently pre v1.0.0)
If you want to use a full-fledged application framework that handles features such as routing, SSR and SSG with little effort then use SvelteKit. The approach to routing is directory structure based similar to frameworks such as Next.js and Nuxt.js for those of you from React and Vue backgrounds.
There are other Svelte based frameworks, but SvelteKit is the official application framework for Svelte.
Run the following commands:
npm init svelte my-app cd my-app npm install npm run dev -- --open
Option 3 - Initialise application with degit (no longer maintained)
degit makes copies of git repositories. This makes it very easy to initialise new starter projects based on a given github repository as oppose to git clone
which pulls down the full git history.
Run the following command:
npx degit sveltejs/template project-name