Add workflow for building and deploying Storybook #3933
Conversation
There was a problem hiding this comment.
PR Overview
This pull request adds a GitHub Actions workflow for building Storybook and deploying it to GitHub Pages. The key changes include:
- Adding a new workflow file (.github/workflows/build-storybook.yml) to build Storybook when pull requests are opened or updated and on pushes to main.
- Splitting the process into two jobs: one for building Storybook and uploading the artifact, and another for deploying it to GitHub Pages.
Changes
| File | Description |
|---|---|
| .github/workflows/build-storybook.yml | New workflow for building and deploying Storybook |
Copilot reviewed 1 out of 1 changed files in this pull request and generated 1 comment.
Tip: If you use Visual Studio Code, you can request a review from Copilot before you push from the "Source Control" tab. Learn more
| deploy: | ||
| environment: | ||
| name: github-pages | ||
| url: ${{ steps.deployment.outputs.page_url }} |
There was a problem hiding this comment.
Something that confuses me here is that both the build and deploy jobs both have a step named deployment. Although I see it is this way in the documentation, is this necessary or correct?
My understanding of the environment is that it will insert environment variables into all the steps in this job, so therefore this is executed before the job starts. And steps.deployment.outputs.page_url is referencing a value output by another step, but this job hasn't run yet, so is it referencing the deployment step from the build job? That seems to be what the copilot suggestion was getting at.
I'm wondering which bits can be deleted (if any) and it still works 🤷🏼
There was a problem hiding this comment.
I believe this ensures that the URL shown for the github-pages deployment is the actual URL of the Pages site. It seems like this url is only evaluated once the workflow has finished, so the page_url is referenced from the actions/deploy-pages step. This would match with the documentation about this url parameter and also matches what is shown in the Actions logs: https://github.com/github/vscode-codeql/actions/runs/13410592273/job/37459738438#step:3:2.
This adds a workflow for building Storybook and deploying it to GitHub Pages. This is based on the official Storybook documentation, although I didn't use the recommended action because we would like to split this up into two steps: building and deploying. That is the recommendation from
actions/upload-pages-artifactand also allows us to only deploy to GitHub Pages on a push tomain, but still build Storybook in PRs.You can view the deployment at https://github.github.com/vscode-codeql/.