NextJS – Build not working but dev mode does

When I run npm run dev my project starts up. When i run npm run build it fails with the following error pasted below.

What’s weird is that I found the third party package that it is failing on. I can remove it and it builds successfully.

The packages that it fails to build are the following:

import dayGridPlugin from "@fullcalendar/daygrid"
import timeGridPlugin from "@fullcalendar/timegrid"
import interactionPlugin from "@fullcalendar/interaction"

error

> Build error occurred
TypeError: Class extends value undefined is not a constructor or null
    at Object.__extends (/Users/asdf/fdsa/node_modules/tslib/tslib.js:70:19)
    at /Users/asdf/fdsa/.next/server/pages/schedule.js:18070:9
    at Object.mNTd (/Users/asdf/fdsa/.next/server/pages/schedule.js:18195:2)
    at __webpack_require__ (/Users/asdf/fdsa/.next/server/pages/schedule.js:23:31)
    at Module.QKeh (/Users/asdf/fdsa/.next/server/pages/schedule.js:15357:16)
    at __webpack_require__ (/Users/asdf/fdsa/.next/server/pages/schedule.js:23:31)
    at Object.3 (/Users/asdf/fdsa/.next/server/pages/schedule.js:195:18)
    at __webpack_require__ (/Users/asdf/fdsa/.next/server/pages/schedule.js:23:31)
    at /Users/asdf/fdsa/.next/server/pages/schedule.js:91:18
    at Object.<anonymous> (/Users/asdf/fdsa/.next/server/pages/schedule.js:94:10) {
  type: 'TypeError'
}

bable.config.js

module.exports = {
  presets: [
    // "@babel/preset-react", // necessary for all .jsx files
    "@babel/preset-env",
    [
      "@babel/preset-react",
      {
        runtime: "automatic",
      },
    ],
  ],
  plugins: ["@babel/plugin-transform-runtime"],

  // fullcalendar attempts to import its own CSS files, but next.js does not allow this.
  // throw away these statements before they arrive at next.js,
  // but you'll need to import them manually in pages/_app.jsx.
  // will also work for any other 3rd-party packages that attempt to do this.
  overrides: [
    {
      include: ["./node_modules"],
      plugins: [
        [
          "babel-plugin-transform-require-ignore",
          {
            extensions: [".css"],
          },
        ],
      ],
    },
  ],
}

next.config.js


// for transpiling all ESM @fullcalendar/* packages
// also, for piping fullcalendar thru babel (to learn why, see babel.config.js)
const withTM = require("next-transpile-modules")([
  "@fullcalendar/core",
  "@fullcalendar/common",
  "@fullcalendar/daygrid",
  "@fullcalendar/timegrid",
])

module.exports = withTM({
  // any other general next.js settings
})

17 thoughts on “NextJS – Build not working but dev mode does”

  1. 434703 210982I was suggested this web site by my cousin. Im not certain whether this post is written by him as nobody else know such detailed about my issue. Youre incredible! Thanks! 802754

    Reply
  2. 797574 432149It is actually a good and valuable piece of info. Im glad that you just shared this useful information with us. Please keep us informed like this. Thanks for sharing. 769323

    Reply
  3. 967629 527589certainly like your web site but you require to check the spelling on several of your posts. Several of them are rife with spelling issues and I discover it really troublesome to tell the truth nevertheless I will surely come back once again. 785175

    Reply

Leave a Comment