首页 > 解决方案 > File structure and scripts for deploying next js app to netlify

问题描述

Pretty new to useing Next JS and combined information from various tutorials, but stuck on what I am doing wrong with either file structure or the build process in general in order to have a successful deployment to Netlify.

In the nextjs tutorial they have you put pages in /pages directory at the root. But most tutorials with webpack have you put them in another directory, the /src. well for now I don't need to worry about webpack and just want to deploy the site.

Followed this tutorial https://medium.com/@azizhk/next-js-netlify-c246ea070ae2

in my package.json i have

"scripts": {
  "dev": "next",
  "build": "next build && next export",
  "start": "serve ./out"
},

My Build Settings in Netlify

enter image description here

Where the build went wrong

6:32:04 PM: Error running command: Build script returned non-zero exit code: 127
6:32:04 PM: Failing build: Failed to build site
6:32:04 PM: failed during stage 'building site': Build script returned non-zero exit code: 127

Updated directory structure

enter image description here

Full notes of errors from build

6:31:16 PM: Build ready to start
6:31:30 PM: build-image version: 9e0f207a27642d0115b1ca97cd5e8cebbe492f63
6:31:30 PM: build-image tag: v3.3.2
6:31:30 PM: buildbot version: 8727aab446158e7b8c8ad2e96fe74b0154505a4e
6:31:30 PM: Fetching cached dependencies
6:31:31 PM: Starting to download cache of 2.0MB
6:31:31 PM: Finished downloading cache in 158.159923ms
6:31:31 PM: Starting to extract cache
6:31:31 PM: Finished extracting cache in 24.261695ms
6:31:31 PM: Finished fetching cache in 184.056316ms
6:31:31 PM: Starting to prepare the repo for build
6:31:31 PM: Preparing Git Reference refs/heads/master
6:31:32 PM: Starting build script
6:31:32 PM: Installing dependencies
6:31:33 PM: Downloading and installing node v10.16.3...
6:31:34 PM: Downloading https://nodejs.org/dist/v10.16.3/node-v10.16.3-linux-x64.tar.xz...
6:31:34 PM: 
######################
6:31:34 PM:     31.2%
6:31:34 PM: 
##################################################################
6:31:34 PM:  92.1%
6:31:34 PM: 
########################################################################
6:31:34 PM: 100.0%
6:31:34 PM: Computing checksum with sha256sum
6:31:34 PM: Checksums matched!
6:31:38 PM: Now using node v10.16.3 (npm v6.9.0)
6:31:38 PM: Attempting ruby version 2.6.2, read from environment
6:31:39 PM: Using ruby version 2.6.2
6:31:39 PM: Using PHP version 5.6
6:31:39 PM: Started restoring cached node modules
6:31:39 PM: Finished restoring cached node modules
6:31:40 PM: Installing NPM modules using NPM version 6.9.0
6:31:59 PM: > core-js@2.6.10 postinstall /opt/build/repo/node_modules/core-js
6:31:59 PM: > node postinstall || echo "ignore"
6:31:59 PM: Thank you for using core-js ( https://github.com/zloirock/core-js ) for polyfilling JavaScript standard library!
6:31:59 PM: The project needs your help! Please consider supporting of core-js on Open Collective or Patreon: 
6:31:59 PM: > https://opencollective.com/core-js 
6:31:59 PM: > https://www.patreon.com/zloirock 
6:31:59 PM: Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -)
6:31:59 PM: > styled-components@4.4.0 postinstall /opt/build/repo/node_modules/styled-components
6:31:59 PM: > node ./scripts/postinstall.js || exit 0
6:31:59 PM: Use styled-components at work? Consider supporting our development efforts at https://opencollective.com/styled-components
6:32:00 PM: npm WARN
6:32:00 PM:  cityguide@1.0.0 No description
6:32:00 PM: npm WARN cityguide@1.0.0 No repository field.
6:32:00 PM: npm
6:32:00 PM: WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules/fsevents):
6:32:00 PM: npm WARN
6:32:00 PM: notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
6:32:00 PM: added 1014 packages from 493 contributors and audited 19416 packages in 19.734s
6:32:00 PM: found 0 vulnerabilities
6:32:00 PM: NPM modules installed
6:32:01 PM: Started restoring cached go cache
6:32:01 PM: Finished restoring cached go cache
6:32:01 PM: unset GOOS;
6:32:01 PM: unset GOARCH;
6:32:01 PM: export GOROOT='/opt/buildhome/.gimme/versions/go1.12.linux.amd64';
6:32:01 PM: export PATH="/opt/buildhome/.gimme/versions/go1.12.linux.amd64/bin:${PATH}";
6:32:01 PM: go version >&2;
6:32:01 PM: export GIMME_ENV='/opt/buildhome/.gimme/env/go1.12.linux.amd64.env';
6:32:01 PM: go version go1.12 linux/amd64
6:32:01 PM: Installing missing commands
6:32:01 PM: Verify run directory
6:32:01 PM: Executing user command: yarn build
6:32:01 PM: /usr/local/bin/build: line 60: yarn: command not found
6:32:01 PM: Skipping functions preparation step: no functions directory set
6:32:01 PM: Caching artifacts
6:32:01 PM: Started saving node modules
6:32:01 PM: Finished saving node modules
6:32:01 PM: Started saving pip cache
6:32:01 PM: Finished saving pip cache
6:32:01 PM: Started saving emacs cask dependencies
6:32:01 PM: Finished saving emacs cask dependencies
6:32:01 PM: Started saving maven dependencies
6:32:01 PM: Finished saving maven dependencies
6:32:01 PM: Started saving boot dependencies
6:32:01 PM: Finished saving boot dependencies
6:32:01 PM: Started saving go dependencies
6:32:01 PM: Finished saving go dependencies
6:32:04 PM: Error running command: Build script returned non-zero exit code: 127
6:32:04 PM: Failing build: Failed to build site
6:32:04 PM: failed during stage 'building site': Build script returned non-zero exit code: 127
6:32:04 PM: Finished processing build request in 33.478673773s

标签: reactjsnext.jspackage.jsonnetlify

解决方案


您可以使用以下脚本在 netlify 中部署您的应用程序

  "scripts": {
    "dev": "next",
    "build": "next build",
    "start": "next start",
    "export": "next export",
    "deploy": "yarn run build && yarn run export"
  },

这是 netlify 构建设置。 在此处输入图像描述

如果你使用的是 npm,那么请写 npm 而不是 yarn。


推荐阅读