GitHub Action으로 Yew.rs 배포하는 방법

Yew

Yew는 React와 같은 구조를 Rust 기반으로 개발하여 WASM으로 배포하는 프론트엔드 프레임워크다. Yew를 써봐야지 익혀봐야지 하면서도 미뤄두고 있다가 최근에서야 해보게 되었다. 개발 환경을 오래전에 만들어서 배포하는 워크플로우를 만들다가 계속 실패해서 난감했다.

rustup target add wasm32-unknown-unknown

위 명령어를 필수로 실행해야 WASM 빌드가 정상적으로 진행됐다. 아마 예전에 해뒀는데 시간지나서 까먹은 것 같다. 나중되면 또 까먹을게 분명해서 기록으로 남겨둔다.

GitHub Action

리포 속 .github/workflows 안에 아래 파일을 생성하면 된다.

name: Build and Deploy
on:
  push:
    branches:
      - master

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v2.3.1
        with:
          persist-credentials: false

      - name: Install and Build
        uses: ATiltedTree/setup-rust@v1
        with:
          rust-version: stable
      - run: rustup target add wasm32-unknown-unknown
      - run: cargo install --locked trunk
      - run: trunk build --release
        env:
          CI: true
          DEPLOY_TARGET: gh-pages
      - run: touch dist/.nojekyll

      - name: Deploy
        uses: JamesIves/github-pages-deploy-action@3.7.1
        with:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          BRANCH: gh-pages  # 배포될 브랜치
          FOLDER: dist # 이 폴더에 있는 파일을 배포
          CLEAN: true # 배포 브랜치에 있는 파일들을 자동으로 삭제

참고로 trunk 빌드하는데 5-10분 정도 걸려서 배포되는 텀이 상당히 길다.

평균적으로 7분 정도 걸리는 듯

Reference

• error[E0463]: can't find crate for core while building rust project for wasm32-unknown-unknown · stackoverflow #