Skip to content

Instantly share code, notes, and snippets.

@antony
Last active September 7, 2023 09:01
Show Gist options
  • Save antony/953ab28b5e2142692acd890dee0a3e89 to your computer and use it in GitHub Desktop.
Save antony/953ab28b5e2142692acd890dee0a3e89 to your computer and use it in GitHub Desktop.
Deploying Sapper to Vercel using Build Output v3 API
pnpm run build
cd __sapper__/build/
mkdir -p $PUBLIC_DIR/${{ inputs.base_path }}
mv client $PUBLIC_DIR/${{ inputs.base_path }}
cp -r ../../static/* $PUBLIC_DIR/
mkdir -p $LAMBDA_DIR
mv index.js server $LAMBDA_DIR/
mkdir -p $BUILD_DIR
mv service-worker.js template.html build.json $BUILD_DIR
cp ${{ github.workspace }}/vercel.json ./app/
cd $LAMBDA_DIR
pnpm i sirv polka core-js compression
mv index.js tmp.js
sed -i 's|"__sapper__/build"|__dirname + "/../files"|g' server/server.js
npx -y @vercel/ncc build ./tmp.js -o .
rm tmp.js
rm -rf server
cd ..
npx vercel build -y --prod --token ${{ secrets.VERCEL_TOKEN }}
npx vercel --prebuilt --prod --token ${{ secrets.VERCEL_TOKEN }} --scope ${{ secrets.VERCEL_SCOPE }}
@antony
Copy link
Author

antony commented Sep 2, 2023

Note that this is from a github action so you need inputs/secrets:

base_path = your application's base path. Ours is mounted on top of another app so the basepath is l/
VERCEL_TOKEN = your vercel api token
VERCEL_SCOPE = your vercel organisation scope
VERCEL_PROJECT_ID = your vercel project id

you'd also want the following in your env: block:

VERCEL_ORG_ID: your vercel org id
BUILD_DIR: app/files
PUBLIC_DIR: app/public
LAMBDA_DIR: app/api

you'll notice the 'sed' line rewrites the __sapper__/build path to __dirname + "/../files". Next apps can use .join(process.cwd(), 'foo') here but any other kind of app needs this weird dirname concatenation. Took me a long time to find that, thanks to some nuxt dev for documenting it in a github discussion somewhere.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment