[feature] automated build and next release #17
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| # | |
| # This workflow follows the following steps: | |
| # 1. Checkout the main branch (see line 27) | |
| # 1. Get the version from the package.json file and store it as environment | |
| # variable for this job | |
| # 1. Build the Storybook and publish it to the GitHub pages | |
| # https://epfl-si.github.io/epfl-elements-react/ | |
| # 1. Build the epfl-elements-react library | |
| # - add the package.json and run npm pack | |
| # 1. Archive production artifacts (not used right now but might be useful later) | |
| # 1. Create a release (with a proper Tag based on the version) → | |
| # duplicated tag are not allowed and will fail! | |
| # 1. Upload both epfl-elements-react-v${{ env.EER_VERSION }}.tgz and | |
| # epfl-elements-react.tgz to the release | |
| # | |
| # | |
| # Note: | |
| # - One might want to split the steps in different jobs: environment | |
| # variables will not work in this case and you will have to use artifacts | |
| # https://docs.github.com/en/actions/using-workflows/storing-workflow-data-as-artifacts#passing-data-between-jobs-in-a-workflow | |
| # - GitHub propose a Packages registry that stores npm packages — we rather | |
| # want to use nomjs but it still need an extra step. For now we can work | |
| # with referencing to this package with its URL in package.json: | |
| # [...] | |
| # "epfl-elements-react": "https://github.com/epfl-si/epfl-elements-react/releases/latest/download/epfl-elements-react.tgz", | |
| # [...] | |
| # | |
| name: Deploy Storybook to GitHub Pages and release epfl-elements-react library | |
| on: | |
| push: | |
| branches: | |
| - main | |
| - next | |
| # Allows you to run this workflow manually from the Actions tab | |
| workflow_dispatch: | |
| jobs: | |
| epfl-elements-react: | |
| runs-on: ubuntu-latest | |
| steps: | |
| # Setup Node.js on ubuntu-latest | |
| - name: Setup Node.js | |
| uses: actions/setup-node@v4 | |
| with: | |
| node-version: '20' | |
| registry-url: 'https://registry.npmjs.org' | |
| # Checkout the 'next' branch | |
| - name: Checkout the 'next' branch | |
| uses: actions/checkout@v4 | |
| with: | |
| ref: 'next' | |
| # Get the version from package.json and export it to | |
| # EER_VERSION environment variable | |
| - name: Export Elements React Version (EER_VERSION) | |
| shell: bash | |
| run: | | |
| echo "EER_VERSION=$(cat package.json | grep version | cut -d'"' -f4)" >> $GITHUB_ENV | |
| echo "EER_VERSION=${{ env.EER_VERSION }}" | |
| # Install npm dependencies (run npm install) | |
| - name: Install npm dependencies | |
| run: npm install | |
| # Build Storybook (run npx storybook build) | |
| - name: Build Storybook | |
| run: npx storybook build | |
| # Deploy to GitHub Pages → https://epfl-si.github.io/epfl-elements-react/ | |
| - name: Deploy to GitHub Pages | |
| uses: JamesIves/github-pages-deploy-action@v4 | |
| with: | |
| ACCESS_TOKEN: ${{ secrets.GITHUB_TOKEN }} | |
| BRANCH: gh-pages | |
| FOLDER: storybook-static | |
| # Build the epfl-elements-react library (npm run build) | |
| - name: Build the epfl-elements-react library | |
| run: npm run build | |
| # Create the package.json that is needed to create a package | |
| - name: Create the package.json | |
| run: jq -n --arg version v${{ env.EER_VERSION }} '{"name":"epfl-elements-react","version":$version,"description":"EPFL Elements React Library","main":"index.js","repository":"github:epfl-si/epfl-elements-react","keywords":["epfl-elements-react"],"author":"EPFL ISAS-FSD","contributors":["Amine672 (https://github.com/Amine672)","Azecko (https://github.com/Azecko)","domq (https://github.com/domq)","GoldenCorgo (https://github.com/GoldenCorgo)","ponsfrilus (https://github.com/ponsfrilus)","rosamaggi (https://github.com/rosamaggi)","webdacjs (https://github.com/webdacjs)"],"license":"MIT","types":"./index.d.ts","bugs":{"url":"https://github.com/epfl-si/epfl-elements-react/issues"},"homepage":"https://github.com/epfl-si/epfl-elements-react#readme"}' > dist/package.json | |
| # Create the epfl-elements-react package | |
| - name: Create the epfl-elements-react package | |
| run: | | |
| npm pack ./dist/ | |
| ls -al | |
| cp epfl-elements-react-v${{ env.EER_VERSION }}.tgz epfl-elements-react.tgz | |
| # Archive production artifacts | |
| - name: Archive production artifacts | |
| uses: actions/upload-artifact@v4 | |
| with: | |
| name: epfl-elements-react | |
| path: | | |
| epfl-elements-react-v${{ env.EER_VERSION }}.tgz | |
| # Create Release | |
| # https://stackoverflow.com/a/75679739/960623 | |
| # Note: this will fail if the tags already exists | |
| - name: Create release | |
| env: | |
| GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} | |
| tag: v${{ env.EER_VERSION }} | |
| run: | | |
| gh release create "$tag" ./*.tgz \ | |
| --target="next" \ | |
| --repo="$GITHUB_REPOSITORY" \ | |
| --title="${GITHUB_REPOSITORY#*/} ${tag#v}" \ | |
| --generate-notes | |
| - name: Publish package on NPM 📦 | |
| run: npm publish epfl-elements-react-v${{ env.EER_VERSION }}.tgz | |
| env: | |
| NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }} |