1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

nuxtをgithub actionsでnetlifyに自動デプロイする

Last updated at Posted at 2020-09-28

netlifyはgitと連携しておけば勝手にビルド&デプロイをしてくれるのでめちゃくちゃ楽なんだけど、無料プランではビルド時間が月300分までとなっている。
これを回避するためにgithub actionsを使ってgithub側でビルドしてあげよう。という作戦。

何よりも最初に注意しておくべきなのは、1度gitと連携してしまうと勝手にビルドする設定になってしまうこと。
自動ビルドを停止することはできるけど、それをやるとデプロイまで停止される。
そのためこの方法を取るときは、gitとは連携せずに、ファイルをドラッグアンドドロップで追加することでサイトを追加する方法を取る必要がある。
(運営に連絡したら連携済みのgitとの連携を解除してくれるみたいだけど)

ドラッグ&ドロップする画面スクショ
スクリーンショット 2020-09-28 16.19.14.png

#設定
githubとnetlifyの設定はぐぐったらわかると思うので割愛します。
トークンとサイトIDの設定だけしておいてください。

【参考】
https://qiita.com/nwtgck/items/e9a355c2ccb03d8e8eb0

あとは.github/workflow.deploy.ymlを追加するだけ。
ここで注意したいのはnetlify/actions/cliの部分で--prodを使うこと。
これはぐぐってもよくわからなかったけど、--prodをつけないとnetlifyのデプロイがDeploy Previewになってしまい、publishedにならない。
このせいで結構困ったけど、--prodをつけたらちゃんと自動でデプロイしてくれた。

.github/workflow.deploy.yml
name: production deploy

on:
  push:
    branches:
      - master

jobs:
  deploy:
    runs-on: ubuntu-18.04
    env:
      GITHUB_TOKEN: ${{ secrets.GIT_TOKEN_COVID19 }}
    steps:
      - uses: actions/checkout@v2
        with:
          ref: master

      - name: Setup Node
        uses: actions/setup-node@v1
        with:
          node-version: '10.x'

      - name: Get yarn cache directory path
        id: yarn-cache-dir-path
        run: echo "::set-output name=dir::$(yarn cache dir)"

      - name: Cache dependencies
        uses: actions/cache@v2
        with:
          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
          key: ${{ runner.os }}-yarn-${{ hashFiles('yarn.lock') }}
          restore-keys: |
            ${{ runner.os }}-yarn-

      - run: yarn install --frozen-lockfile
      - run: yarn run test
      - name: generate
        run: |
          yarn run generate:deploy --fail-on-page-error

      - name: Deploy
        uses: netlify/actions/cli@master
        with:
          args: deploy --dir=dist --prod
        env:
          NETLIFY_SITE_ID: ${{ secrets.NETLIFY_SITE_ID }}
          NETLIFY_AUTH_TOKEN: ${{ secrets.GIT_TOKEN_COVID19 }}

#補足 --prod問題
スクリーンショット 2020-09-28 11.37.55.png

公開されるデプロイには緑のpublishedというマークがつくが、gitにpushしてもnetlify上ではDeploy Previewというデプロイが表示されるだけで、publishedにならない。

ymlファイルのnetlify/actions/cliの部分で--prodをつけたら解決した。
ぐぐってもよくわからなかったけど、--prodはproductionの略なのかな?

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?