Closed5

Next.jsアプリがAzure App Serviceで動かない

choshicurechoshicure

起動時にError: Cannot find module '../build/output/log'というエラーが起きてアプリが起動しない
解決法をメモ

choshicurechoshicure

https://github.com/vercel/next.js/discussions/14897
同様のエラーがディスカッションされている

どうやらデプロイ時にシンボリックがなくなっているのが原因らしい
シンボリックを保持してzipファイルにすることでうまく行くと書いてあるが、うまく行かなかった

name: Build and deploy Node.js app to Azure Web App - test-nextjs-app
on:
  push:
    branches:
      - main
  workflow_dispatch:
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: Set up Node.js version
        uses: actions/setup-node@v1
        with:
          node-version: '16.x'
      - name: npm install, build, and test
        run: |
          npm install
          npm run build --if-present
          npm run test --if-present

+     - name: create zip
+       run: zip -ry /tmp/artifact.zip ./

      - name: Upload artifact for deployment job
        uses: actions/upload-artifact@v2
        with:
          name: node-app
-         path: .
+         path: /tmp/artifact.zip

  deploy:
    runs-on: ubuntu-latest
    needs: build
    environment:
      name: 'Production'
      url: ${{ steps.deploy-to-webapp.outputs.webapp-url }}
    steps:
      - name: Download artifact from build job
        uses: actions/download-artifact@v2
        with:
          name: node-app
      - name: 'Deploy to Azure Web App'
        id: deploy-to-webapp
        uses: azure/webapps-deploy@v2
        with:
          app-name: 'test-nextjs-app'
          slot-name: 'Production'
          publish-profile: ${{ secrets.AZUREAPPSERVICE_PUBLISHPROFILE_168E36299F364070BC5065D730DA6726 }}
-         package: .
+         package: artifact.zip
choshicurechoshicure

結局のところnode_modules/next/dist/bin/にあるnextコマンドを直接実行すればうまくいった

package.json
  "scripts": {
    "dev": "next dev",
    "build": "next build",
-   "start": "next start",
+   "start": "node_modules/next/dist/bin/next start",
    "lint": "next lint",
    "post-update": "echo \"codesandbox preview only, need an update\" && yarn upgrade --latest"
  },
choshicurechoshicure

ちなみに、zipファイルにはしておくべき
zipファイルにしないとファイル一つ一つをアップロードすることになるのでとても時間がかかる

choshicurechoshicure
name: Build and deploy Node.js app to Azure Web App - test-nextjs-app
on:
  push:
    branches:
      - main
  workflow_dispatch:
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: Set up Node.js version
        uses: actions/setup-node@v1
        with:
          node-version: '16.x'
      - name: npm install, build, and test
        run: |
          npm install
          npm run build --if-present
          npm run test --if-present

+     - name: delete node_modules dir
+       run: rm -rf node_modules

      - name: Upload artifact for deployment job
        uses: actions/upload-artifact@v2
        with:
          name: node-app
          path: .

  deploy:
    runs-on: ubuntu-latest
    needs: build
    environment:
      name: 'Production'
      url: ${{ steps.deploy-to-webapp.outputs.webapp-url }}
    steps:
      - name: Download artifact from build job
        uses: actions/download-artifact@v2
        with:
          name: node-app

+     - name: npm install production
+       run: npm install --production

      - name: 'Deploy to Azure Web App'
        id: deploy-to-webapp
        uses: azure/webapps-deploy@v2
        with:
          app-name: 'test-nextjs-app'
          slot-name: 'Production'
          publish-profile: ${{ secrets.AZUREAPPSERVICE_PUBLISHPROFILE_168E36299F364070BC5065D730DA6726 }}
          package: .

node_modulesのフォルダを一度削除して次のjobに進むパターン
デプロイ前にproductionのオプションをつけてライブラリをインストールすることで余計なものがインストールされないのでこちらの方がいいかもしれない

このスクラップは2022/03/18にクローズされました