takanori-azegami-jp / nextjs-github-pages-sample

GitHub PagesにNext.js をデプロイする

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

nextjs-github-pages-sample

GitHub PagesにNext.js をデプロイする

1.Node.jsインストールする

2.Next.jsを初期設定

$ mkdir [リポジトリ名]
$ cd [リポジトリ名]
$ npm init -y
$ npm install --save react react-dom next
$ mkdir pages

3.静的サイトを生成

# ビルド
$ npm run build
# 静的サイトを生成
$ npm run export
# ローカル起動
$ npm run start

4.ローカル確認

ブラウザでhttp://localhost:3000で動作確認

5.GitHub Pagesにデプロイ

.github/workflows/gh-pages.ymlでGitHub Actionsを実行

  • デプロイでエラーがでたら
Action failed with "The process '/usr/bin/git' failed with exit code 128"

Settings → Actions → General > read and write permissionsに変更

6.GitHub Pagesのリポジトリに設定変更

リポジトリ > Settings > Pages > Brnchをgh-pagesに変更

7.GitHub Pagesに接続

参考

About

GitHub PagesにNext.js をデプロイする


Languages

Language:JavaScript 100.0%