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

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"



Solution 1:[1]

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.

Solution 2:[2]

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

Solution 3:[3]

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

Solution 4:[4]

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

Solution 5:[5]

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

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 gbengaoyetade
Solution 2 Orlando Rivera
Solution 3 emersonthis
Solution 4 Sunar Pichin
Solution 5 aysi