Hot Module Replacement (HMR) state preservation is disabled by default in this template due to unpredictable behavior. If you have component state that must be retained during development (e.g., when a file is saved and reloaded), move that state into an external Svelte store. External stores are not replaced by HMR and will persist the data.

// store.ts
// An extremely simple external store
import { writable } from "svelte/store";
export default writable(0);

To create a new project based on this template, use degit to clone the repository and then install the dependencies.

1. Clone the template:

   npx degit sveltejs/template svelte-app
   cd svelte-app

2. Install dependencies:

   npm install

3. Start the development server:

   npm run dev

By default, the server responds only to localhost. To allow connections from other computers on your network, edit the sirv commands in package.json to include the --host 0.0.0.0 option.

To run the application locally, install the project dependencies and start the webpack development server.

cd svelte-app
npm install
npm run dev

To create an optimized version of your application for production, run the build script. You can then serve the built application using the start command, which utilizes sirv.

1. Build the app:

   npm run build

2. Run the built app:

   npm run start

Install the package using npm or yarn to enable rendering Svelte components outside of their parent DOM hierarchy.

npm install --save svelte-portal

or

yarn add svelte-portal

To deploy your project to Vercel:

1. Install the Vercel CLI globally:

   npm install -g vercel

2. Deploy from your project folder:

   cd public
   vercel deploy --name my-project

To deploy your project using Surge, install the surge CLI globally, build the production assets, and then deploy the public directory.

npm install -g surge
npm run build
surge public

This template includes a script to configure a TypeScript development environment. Run the following command immediately after cloning the template:

node scripts/setupTypeScript.js

To ensure full type safety when using <script lang="ts">, import the component directly from the source path instead of the package entry point.

// Instead of: import Portal from "svelte-portal";
import Portal from "svelte-portal/src/Portal.svelte";

To deploy your project to Surge:

1. Install the Surge CLI globally:

   npm install -g surge

2. Build your project and deploy the public folder:

   npm run build
   surge public my-project.surge.sh

To deploy your project using Now, install the now CLI globally and run the now command from within your project folder.

npm install -g now
now