Skip to content

Storybook Preview Deployment #8

Storybook Preview Deployment

Storybook Preview Deployment #8

name: Storybook Preview Deployment
env:
VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}
VERCEL_PROJECT_ID: ${{ secrets.VERCEL_STORYBOOK_PROJECT_ID }}
on:
workflow_dispatch:
jobs:
storybook-preview:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v3
with:
node-version: 18.x
- uses: pnpm/[email protected]
with:
version: 8
- uses: actions/cache@v3
id: pnpm-cache
with:
path: node_modules
key: ${{ runner.os }}-pnpm-${{ hashFiles('pnpm-lock.yaml') }}
restore-keys: |
${{ runner.os }}-pnpm-
- if: steps.pnpm-cache.outputs.cache-hit != 'true'
run: pnpm install --no-frozen-lockfile
- name: Build Storybook
run: pnpm run build-storybook
- name: Install Vercel CLI
run: npm install --global vercel@latest
- name: Pull Vercel Environment Information
run: vercel pull --yes --environment=preview --token=${{ secrets.VERCEL_TOKEN }}
- name: Build Project Artifacts
run: vercel build --token=${{ secrets.VERCEL_TOKEN }}
- name: Deploy Project Artifacts to Vercel
id: deploy
run: |
export DEPLOYMENT_URL=$(vercel deploy --prebuilt --token=${{ secrets.VERCEL_TOKEN }})
echo "deployed at: $DEPLOYMENT_URL"
echo "url=$DEPLOYMENT_URL" >> $GITHUB_OUTPUT
- uses: actions/github-script@v6
with:
github-token: ${{secrets.GITHUB_TOKEN}}
script: |
try {
const { data: [{ number }] } = await github.rest.repos.listPullRequestsAssociatedWithCommit({
owner: context.repo.owner,
repo: context.repo.repo,
commit_sha: context.sha,
});
await github.rest.issues.createComment({
issue_number: number,
owner: context.repo.owner,
repo: context.repo.repo,
body: '🚀 Storybook Preview deployed at: ${{ steps.deploy.outputs.url }}'
})
} catch (error) {
console.log("failed to create comment. skipping...")
console.log(error)
}