5

Deploy SvelteKit App with Vercel

 3 years ago
source link: https://dev.to/hideckies/deploy-sveltekit-app-with-vercel-28ma
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

This article is from my blog.

I’ve been fond of Svelte since last year, and just the other day I made a new web app with SvelteKit.
It is deployed with Vercel, but I struggled a little when deploying it so I write how to deploy with Vercel.

1. Create a SvelteKit app 

npm init svelte@next my-app
cd my-app
npm install
npm run dev
Enter fullscreen modeExit fullscreen mode

2. Add an adapter in a configuration file

At first, install the depencency.

npm i -D @sveltejs/adapter-static@next
Enter fullscreen modeExit fullscreen mode

Don’t forget to add a suffix (@next) to the package name at this point.

And then, add a value into adapter in a svelte.config.js.

import node from '@sveltejs/adapter-static';

const config = {
    kit: {
        // ...
        adapter: node(),
        // ...
    }
}
Enter fullscreen modeExit fullscreen mode

This will output static files to build directory for hosting by Vercel.

3. Push it on GitHub 

git init
git add .
git commit -m "first commit"
git remote add origin https://github.com/<YOUR-USER-NAME>/<YOUR-REPOSITORY-NAME>
git push -u origin main
Enter fullscreen modeExit fullscreen mode

Please see the guides for details.

4. Deploy with Vercel

In Vercel, deploy your app.

Configure your project as follow images:

Override the value of the OUTPUT DIRECTORY:

5. It's Done

Ok, Vercel should now build correctly and display your web app.


report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK