Cannot deploy Next.js to Netlify. Deploy failed due to an error in @netlify/plugin-nextjs plugin
Asked Answered
L

11

7

I can run npm run build with no problems at all, but whenever I try and deploy my Next.js project to Netlify I get an odd error stating Deploy failed due to an error in @netlify/plugin-nextjs plugin

After doing some research I found that I should install @netlify/plugin-nextjs into my package.json as a dev dependency, then add it to a netlify.toml in the root of my project which I have done. Here is the github repo which Netlify's support forums have led me to: https://github.com/netlify/netlify-plugin-nextjs

I've followed the directions on their github repo above for the @netlify/plugin-nextjs plugin as well as searched for any relevant posts under their github issues and unfortunately I couldn’t find anything related nor useful in the github issues.

I’ve tried clearing cache and deploy but it didn’t help.

I am using Next.js version v11.1.2

Here is the build log with the error detailed:

11:58:50 PM: Started restoring cached go cache
11:58:50 PM: Finished restoring cached go cache
11:58:50 PM: go version go1.16.5 linux/amd64
11:58:50 PM: go version go1.16.5 linux/amd64
11:58:50 PM: Installing missing commands
11:58:50 PM: Verify run directory
11:58:52 PM: ​
11:58:52 PM: ────────────────────────────────────────────────────────────────
11:58:52 PM:   Netlify Build                                                 
11:58:52 PM: ────────────────────────────────────────────────────────────────
11:58:52 PM: ​
11:58:52 PM: ❯ Version
11:58:52 PM:   @netlify/build 18.21.2
11:58:52 PM: ​
11:58:52 PM: ❯ Flags
11:58:52 PM:   baseRelDir: true
11:58:52 PM:   buildId: 618232a9499e9a000783387d
11:58:52 PM:   deployId: 618232a9499e9a000783387f
11:58:52 PM: ​
11:58:52 PM: ❯ Current directory
11:58:52 PM:   /opt/build/repo
11:58:52 PM: ​
11:58:52 PM: ❯ Config file
11:58:52 PM:   /opt/build/repo/netlify.toml
11:58:52 PM: ​
11:58:52 PM: ❯ Context
11:58:52 PM:   production
11:58:52 PM: ​
11:58:52 PM: ❯ Installing plugins
11:58:52 PM:    - @netlify/[email protected]
11:59:02 PM: ​
11:59:02 PM: ❯ Loading plugins
11:59:02 PM:    - @netlify/[email protected] from netlify.toml
11:59:03 PM: ​
11:59:03 PM: ────────────────────────────────────────────────────────────────
11:59:03 PM:   1. @netlify/plugin-nextjs (onPreBuild event)                  
11:59:03 PM: ────────────────────────────────────────────────────────────────
11:59:03 PM: ​
11:59:03 PM: ​
11:59:03 PM: ────────────────────────────────────────────────────────────────
11:59:03 PM:   Plugin "@netlify/plugin-nextjs" failed                        
11:59:03 PM: ────────────────────────────────────────────────────────────────
11:59:03 PM: ​
11:59:03 PM:   Error message
11:59:03 PM:   Error: This site does not seem to be using Next.js. Please run "npm install next" in the repository.
11:59:03 PM:   If you are using a monorepo, please see the docs on configuring your site: https://ntl.fyi/next-monorepos
11:59:03 PM: ​
11:59:03 PM:   Plugin details
11:59:03 PM:   Package:        @netlify/plugin-nextjs
11:59:03 PM:   Version:        3.9.2
11:59:03 PM:   Repository:     git+https://github.com/netlify/netlify-plugin-nextjs.git
11:59:03 PM:   npm link:       https://www.npmjs.com/package/@netlify/plugin-nextjs
11:59:03 PM:   Report issues:  https://github.com/netlify/netlify-plugin-nextjs/issues
11:59:03 PM: ​
11:59:03 PM:   Error location
11:59:03 PM:   In "onPreBuild" event in "@netlify/plugin-nextjs" from netlify.toml
11:59:03 PM:       at validateNextUsage (/.netlify/plugins/node_modules/@netlify/plugin-nextjs/helpers/validateNextUsage.js:15:12)
11:59:03 PM:       at onPreBuild (/.netlify/plugins/node_modules/@netlify/plugin-nextjs/index.js:32:5)
11:59:03 PM: ​
11:59:03 PM:   Resolved config
11:59:03 PM:   build:
11:59:03 PM:     command: next build
11:59:03 PM:     commandOrigin: config
11:59:03 PM:     environment:
11:59:03 PM:       - FACEBOOK_APP_ID
11:59:03 PM:       - FACEBOOK_APP_SECRET
11:59:03 PM:       - GATSBY_STRIPE_PK
11:59:03 PM:       - NEXT_PUBLIC_FIREBASE_API_KEY
11:59:03 PM:       - NEXT_PUBLIC_FIREBASE_APPID
11:59:03 PM:       - NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN
11:59:03 PM:       - NEXT_PUBLIC_FIREBASE_DATABASE_URL
11:59:03 PM:       - NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID
11:59:03 PM:       - NEXT_PUBLIC_FIREBASE_PROJECT_ID
11:59:03 PM:       - NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET
11:59:03 PM:       - NEXT_PUBLIC_STRAPI
11:59:03 PM:       - NEXT_PUBLIC_STRAPI_DEV
11:59:03 PM:       - NEXT_PUBLIC_STRAPI_FETCH
11:59:03 PM:       - NEXT_PUBLIC_STRAPI_PROD
11:59:03 PM:       - STRAPI_API
11:59:03 PM:       - CYPRESS_CACHE_FOLDER
11:59:03 PM:     ignore: git diff --quiet $CACHED_COMMIT_REF $COMMIT_REF . ../
11:59:03 PM:     publish: /opt/build/repo/.next
11:59:03 PM:     publishOrigin: config
11:59:03 PM:   plugins:
11:59:03 PM:     - inputs: {}
11:59:03 PM:       origin: config
11:59:03 PM:       package: '@netlify/plugin-nextjs'
11:59:04 PM: Caching artifacts
11:59:04 PM: Started saving node modules
11:59:04 PM: Finished saving node modules
11:59:04 PM: Started saving build plugins
11:59:04 PM: Finished saving build plugins
11:59:04 PM: Started saving yarn cache
11:59:29 PM: Finished saving yarn cache
11:59:29 PM: Started saving pip cache
11:59:29 PM: Finished saving pip cache
11:59:29 PM: Started saving emacs cask dependencies
11:59:29 PM: Finished saving emacs cask dependencies

Here is my package.json file:

{
  "name": "@minimal/minimal-kit-react",
  "author": "minimals.cc",
  "version": "2.6.0",
  "private": true,
  "scripts": {
    "dev": "next dev -p 3222",
    "build": "next build",
    "start": "next start"
  },
  "dependencies": {
    "@apollo/client": "^3.4.16",
    "@auth0/auth0-spa-js": "1.18",
    "@emotion/cache": "^11.4.0",
    "@emotion/react": "^11.4.1",
    "@emotion/server": "^11.4.0",
    "@emotion/styled": "^11.3.0",
    "@fontsource/alata": "^4.5.0",
    "@fontsource/barlow": "^4.5.0",
    "@fontsource/inter": "^4.5.0",
    "@fontsource/karla": "^4.5.0",
    "@fontsource/poppins": "^4.5.0",
    "@fontsource/public-sans": "^4.5.0",
    "@fontsource/raleway": "^4.5.0",
    "@fullcalendar/daygrid": "^5.9.0",
    "@fullcalendar/interaction": "^5.9.0",
    "@fullcalendar/list": "^5.9.0",
    "@fullcalendar/react": "^5.9.0",
    "@fullcalendar/timegrid": "^5.9.0",
    "@fullcalendar/timeline": "^5.9.0",
    "@hookform/devtools": "^4.0.1",
    "@hookform/resolvers": "^2.8.0",
    "@iconify/icons-ant-design": "^1.1.0",
    "@iconify/icons-eva": "^1.1.0",
    "@iconify/icons-ic": "^1.1.10",
    "@iconify/icons-simple-icons": "^1.1.46",
    "@material-ui/core": "^4.11.0",
    "@material-ui/data-grid": "^4.0.0-alpha.21",
    "@material-ui/icons": "^4.11.2",
    "@material-ui/lab": "^4.0.0-alpha.56",
    "@mui/icons-material": "^5.0.0",
    "@mui/lab": "^5.0.0-alpha.47",
    "@mui/material": "^5.0.0",
    "@mui/styles": "^5.0.0",
    "@mui/utils": "^5.0.0",
    "@mui/x-data-grid": "^5.0.0-beta.1",
    "@react-pdf/renderer": "^2.0.19",
    "@reduxjs/toolkit": "^1.6.1",
    "@stripe/react-stripe-js": "^1.5.0",
    "@stripe/stripe-js": "^1.18.0",
    "@testing-library/jest-dom": "^5.14.1",
    "@testing-library/react": "^12.1.0",
    "@testing-library/user-event": "^13.2.1",
    "@turf/bbox": "^6.5.0",
    "amazon-cognito-identity-js": "^5.1.0",
    "animejs": "^3.2.1",
    "apexcharts": "^3.28.3",
    "autosuggest-highlight": "^3.1.1",
    "axios": "^0.21.4",
    "axios-mock-adapter": "^1.20.0",
    "change-case": "^4.1.2",
    "d3-array": "^3.0.2",
    "d3-scale": "^4.0.0",
    "date-fns": "^2.24.0",
    "deck.gl": "^8.5.8",
    "dotenv": "^10.0.0",
    "draft-js": "^0.11.7",
    "draftjs-to-html": "^0.9.1",
    "emoji-mart": "^3.0.0",
    "firebase": "^8.10.0",
    "formik": "^2.2.9",
    "framer-motion": "^4.1.17",
    "fs": "^0.0.1-security",
    "graphql": "^15.7.1",
    "highlight.js": "^11.3.1",
    "history": "^5.0.1",
    "i18next": "^20.6.1",
    "i18next-browser-languagedetector": "^6.1.2",
    "immutable": "^4.0.0-rc.14",
    "jsonwebtoken": "^8.5.1",
    "jwt-decode": "^3.1.2",
    "lazysizes": "^5.3.2",
    "lodash": "^4.17.21",
    "lowlight": "^2.4.0",
    "madge": "^5.0.1",
    "mapbox-gl": "^2.4.1",
    "next": "^11.1.2",
    "notistack": "^1.0.6-next.3",
    "nprogress": "^0.2.0",
    "numeral": "^2.0.6",
    "pnp-webpack-plugin": "^1.7.0",
    "process": "^0.11.10",
    "prop-types": "^15.7.2",
    "react": "17.0.2",
    "react-apexcharts": "^1.3.9",
    "react-beautiful-dnd": "^13.1.0",
    "react-copy-to-clipboard": "^5.0.4",
    "react-dom": "17.0.2",
    "react-draft-wysiwyg": "^1.14.7",
    "react-dropzone": "^11.4.0",
    "react-helmet-async": "^1.1.2",
    "react-highlight": "^0.14.0",
    "react-hook-form": "^7.15.3",
    "react-i18next": "^11.12.0",
    "react-image-lightbox": "^5.1.4",
    "react-infinite-scroll-component": "^6.1.0",
    "react-intersection-observer": "^8.32.1",
    "react-lottie": "^1.2.3",
    "react-map-gl": "^6.1.17",
    "react-markdown": "^7.1.0",
    "react-quill": "^2.0.0-beta.4",
    "react-redux": "^7.2.5",
    "react-resize-aware": "^3.1.1",
    "react-scripts": "^4.0.1",
    "react-scroll": "^1.8.4",
    "react-slick": "^0.28.0",
    "react-spring": "^9.2.4",
    "redux": "^4.1.1",
    "redux-persist": "^6.0.0",
    "rehype-highlight": "^5.0.0",
    "rehype-raw": "^6.1.0",
    "simplebar": "^5.3.5",
    "simplebar-react": "^2.3.5",
    "slick-carousel": "^1.8.1",
    "stylis": "^4.0.10",
    "stylis-plugin-rtl": "^2.0.2",
    "typescript": "^4.3.5",
    "uuid": "^8.3.2",
    "worker-loader": "^3.0.8",
    "yup": "^0.32.9"
  },
  "devDependencies": {
    "@babel/core": "^7.15.8",
    "@babel/eslint-parser": "^7.15.4",
    "@babel/preset-react": "^7.14.5",
    "@iconify/icons-fa-solid": "^1.1.1",
    "@iconify/react": "^3.0.1",
    "@netlify/plugin-nextjs": "^4.0.0-beta.5",
    "@types/node": "^16.7.13",
    "@typescript-eslint/eslint-plugin": "^4.31.0",
    "@typescript-eslint/parser": "^4.31.0",
    "eslint": "^7.32.0",
    "eslint-config-airbnb": "^18.2.1",
    "eslint-config-airbnb-typescript": "^14.0.0",
    "eslint-config-prettier": "^8.3.0",
    "eslint-config-wesbos": "2.1.0",
    "eslint-plugin-html": "^6.1.2",
    "eslint-plugin-import": "^2.24.2",
    "eslint-plugin-jsx-a11y": "^6.4.1",
    "eslint-plugin-prettier": "^4.0.0",
    "eslint-plugin-react": "^7.25.1",
    "eslint-plugin-react-hooks": "^4.2.0",
    "graphql": "latest",
    "prettier": "^2.3.2",
    "typescript": "^4.4.2"
  }
}

Here is my netlify.toml:

[build]
publish = ".next"

[[plugins]]
package = "@netlify/plugin-nextjs"

Lazes answered 3/11, 2021 at 20:1 Comment(0)
H
7

I had this same issue. Removing the @netlify/plugin-nextjs from the plugins tab on Netlify fixed the issue for me. I removed the plugin and triggered a new deploy.

Haywire answered 5/12, 2021 at 20:29 Comment(2)
I tried this and the deploy succeeded but then the site showed a Netlify 404 page. Did you add the plugin again afterwards?Duomo
@Duomo I didn't do that. I changed from getServerSideProps to getStaticPropsHaywire
L
1

I had the same issue and I resolved it by updating the plugin from the plugins tab in Netlify.

Lalittah answered 11/4, 2022 at 15:1 Comment(0)
V
1

First: npm install @netlify/plugin-nextjs@latest

Second, create netlify.toml file in the root of your project.

Paste the code down below inside the netlify.toml file

[build]
  command = "next build && next export"
  publish = "out"

[[plugins]]
  package = "@netlify/plugin-nextjs"

[build.environment]
  NETLIFY_NEXT_PLUGIN_SKIP = "true"

That's it 😊

Verbalism answered 10/12, 2023 at 7:53 Comment(0)
D
0

In my case, the solution was to disable the plugin, and then re-enable it. Disabling the plugin broke my site temporarily because it's needed to run Next.js, but it was the only way I could get my deploy to succeed.

Other things I tried that did not work:

  • Re-building node_modules
  • Updating package-lock.json
  • Triggering a re-deploy without cache
Duomo answered 12/4, 2022 at 3:57 Comment(0)
G
0

If you are using a monorepo to fix this issue go to the deploy settings of your site and under build settings change the publish directory to

[subdir]/.next

where [subdir] is the sub directory you have your next project in.

After that clear change and deploy again

Goop answered 24/4, 2022 at 17:38 Comment(0)
G
0

I have faced the same issues. I tried adding the NETLIFY_NEXT_PLUGIN_SKIP= "TRUE"to the environment variables and it worked for me

Gassing answered 28/4, 2022 at 11:43 Comment(0)
C
0

1st in your project folder cmd or git bash run (yarn build) then go to the netlify build setting and change (Build command: next build) this process is work for me

Corporative answered 14/6, 2022 at 14:36 Comment(0)
N
0

remove the netlify.toml file and let netlify build it with the default npm run build

Norrisnorrv answered 5/9, 2022 at 9:12 Comment(0)
D
0

I also faced the same issue. There is something wrong in @netlify/plugin-nextjs plugin latest version 4.0

Try doing this and this worked for me.

In netlify, under your project, do this.

Site Settings -> Plugins -> Next.js Runtime -> click Change version and select version 3.

NextJs plugin version change screenshot

And redeploy the site.

Darnelldarner answered 18/10, 2022 at 7:40 Comment(0)
C
0

In my case I got the same error because I have forgotten to add some environment variables to netlify which were needed on build time. Once I had added them and triggered a new deploy, it worked.

Castleman answered 21/5, 2023 at 14:15 Comment(0)
E
0

To resolve the deployment issue with your Next.js project on Netlify related to the @netlify/plugin-nextjs plugin, follow these steps:

  1. Set the Publish Directory to "out" You need to configure the Netlify publish directory to point to the out directory, which is where the static export will be placed after running next export.

Steps to Set the Publish Directory: Log into your Netlify Dashboard. Select your Site from the list. Go to Site settings. Click on Build & deploy in the left sidebar. Under Continuous Deployment, find the Publish directory setting. Set the Publish directory to out. 2. Set the Environment Variable Next, you need to set the environment variable NETLIFY_NEXT_PLUGIN_SKIP to true.

Steps to Set the Environment Variable: In the same Site settings section, go to Build & deploy > Environment. Click on Edit Variables. Add a new variable: Key: NETLIFY_NEXT_PLUGIN_SKIP Value: true Save your changes.

Epidaurus answered 24/9, 2024 at 15:12 Comment(0)

© 2022 - 2025 — McMap. All rights reserved.