# Svelte / SvelteKit





<Tabs items="[&#x22;SvelteKit&#x22;, &#x22;Svelte + Vite&#x22;]">
  <Tab value="SvelteKit">
    SvelteKit requires the static adapter to generate deployable static files.

    Deploy with SvelteKit [#deploy-with-sveltekit]

    <Steps>
      <Step>
        Install the static adapter [#install-the-static-adapter]

        ```bash
        npm install -D @sveltejs/adapter-static
        ```
      </Step>

      <Step>
        Configure the adapter [#configure-the-adapter]

        ```js title="svelte.config.js"
        import adapter from "@sveltejs/adapter-static";

        export default {
          kit: {
            adapter: adapter({
              fallback: "index.html",
            }),
          },
        };
        ```

        <Callout type="info">
          Setting `fallback: 'index.html'` enables SPA mode, which works with Sample.app's built-in SPA
          fallback for client-side routing.
        </Callout>
      </Step>

      <Step>
        Build your project [#build-your-project]

        ```bash
        npm run build
        ```

        This outputs to `build/` by default.
      </Step>

      <Step>
        Deploy to Sample.app [#deploy-to-sampleapp]

        ```bash
        samplex deploy ./build
        ```
      </Step>
    </Steps>
  </Tab>

  <Tab value="Svelte + Vite">
    Plain Svelte apps (without SvelteKit) use Vite and output to `dist/` by default.

    Deploy with Svelte + Vite [#deploy-with-svelte--vite]

    <Steps>
      <Step>
        Build your project [#build-your-project-1]

        ```bash
        npm run build
        ```
      </Step>

      <Step>
        Deploy to Sample.app [#deploy-to-sampleapp-1]

        ```bash
        samplex deploy
        ```

        Auto-detection finds the `dist/` directory.
      </Step>
    </Steps>
  </Tab>
</Tabs>
