'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 |