Next.jsのプロジェクトをNetlifyにアップする

2020.09.12
Next.jsのプロジェクトをNetlifyにアップする

package.jsonに exportdeploy コマンドを追加

package.json
・・・
"scripts": {
  "dev": "next dev",
  "build": "next build",
  "start": "next start",
  "export": "next export",
  "deploy": "yarn run build && yarn run export"
},
・・・


deploy コマンドを実行すると /out/ にビルドしたファイルが書き出されるようになります。

Netlifyでプロジェクトを作成する

Netlifyで「Create a new site」を実行

「Basic Build Settings」に

  • Build command・・ yarn run deploy
  • Publish directory・・ out

を設定。

この状態でDeploy Siteを押下します。

Netlifyでビルドの設定を変更する

既にNetlifyにプロジェクトを紐付けている場合は、
Settings > Build&Deploy のBuild settingsの「Edit settings」から変更します。

  • Build command・・ yarn run deploy
  • Publish directory・・ out

おすすめ