Chapter 05

GitHub Actions - Part 1

たしかにライブラリは公開されたけど、すべてローカル開発ですね。ここからはGitHub Actionsを使用したCI/CDを構築していきます。(こういうのができると、かっこいいよね😸)

🛠 リポジトリの作成

まずはGitHubでリポジトリを作成します。
今回はGitHub CLIを使用しますが、GitHubのGUIからでも問題ないです。

$ gh repo create my-original-library-demo

もしGitHub CLIをインストールしてなければ、以下からしてください。

$ brew install gh
$ gh auth login

🔐 npmトークンの取得

GitHub Actionsを作成する前に、Access Tokensに移動してトークンを発行します。


Access Tokensを選択する


Publishを選択する


Generate New Tokenを選択する


トークンが発行される

トークンが発行されたら、コピーしてGitHub Secretsに貼り付けます。

New repository secretを選択する


コピーしたトークンを貼り付ける


Repository secretsが追加される

🏄‍♂️ ワークフローの作成

ここからは実際にワークフローを設定するので、必要なファイルを作成しましょう。

$ mkdir -p .github/workflows/ && touch .github/workflows/release.yml

以下のワークフローをrelease.ymlに貼り付けます。

.github/workflows/release.yml
name: CICD

# Triggers when pushed to master branch
on:
  push:
    branches:
      - master
    tags:
      - '!*'

jobs:
  release:
    name: release-npm-package
    runs-on: ubuntu-latest
    steps:
      - name: checkout
        uses: actions/checkout@v2
      - name: setup-node
        uses: actions/setup-node@v2
        with:
          node-version: 14.x
          registry-url: 'https://registry.npmjs.org'

      # Get current package version
      - name: current-package-version
        run: node -p -e '`CURRENT_PACKAGE_VERSION=${require("./package.json").version}`' >> $GITHUB_ENV

      # Create tag with current package version
      - name: current-package-version-to-git-tag
        uses: pkgdeps/git-tag-action@v2
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          github_repo: ${{ github.repository }}
          git_commit_sha: ${{ github.sha }}
          git_tag_prefix: ''
          version: ${{ env.CURRENT_PACKAGE_VERSION }}

      # Publish to npm
      - name: publish-to-npm
        run: npm publish
        env:
          NODE_AUTH_TOKEN: ${{ secrets.NPM_ACCESS_TOKEN }}

もう一度コミットして、リモートリポジトリにプッシュします。

$ git status
$ git add .
$ git commit -m "feat: npm release github actions"
$ npm version patch # 👈 これが重要だよ (1.0.0 から 1.0.1 にバージョンアップするよ)
$ git push origin master

GitHub Actionsが作動していることが確認できます。

✅ バージョンアップするには、majorminorpatchがあるよ
npm version major 👉 1.0.0 から 2.0.0
npm version minor 👉 1.0.0 から 1.1.0
npm version patch 👉 1.0.0 から 1.0.1

バージョンアップしないと、エラーになるので注意しましょう。


前回と同じバージョンだと更新できません

問題なく動作していれば、最新バージョンがnpmにも反映されます。


おめでとうございます!バージョンが 1.0.1 になりました🎉🎉🎉