Next-plugins: withSourceMaps is not a function

[Jauny]

Hi,

I'm trying to generate source-maps (ideally full source maps for production to debug a prod-only issue), but I can't get next-source-maps to work.

I've generate a new next.js project with only a pages/index.js page that says hello world. When following the readme for next-source-maps I get a withSourceMaps is not a function error.

next.conf.js

const withSourceMaps = require('@zeit/next-source-maps')({
  devtool: 'hidden-source-map'
})

module.exports = withSourceMaps(
  {
    webpack(config, options) {
      return config
    }
  }
)

the error when trying to yarn build

next (master) $ yarn build
yarn run v1.5.1
warning package.json: No license field
$ next build
TypeError: withSourceMaps is not a function
    at Object.<anonymous> (/Users/jonathanpepin/next/next.config.js:5:18)
    at Module._compile (module.js:652:30)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
    at tryModuleLoad (module.js:505:12)
    at Function.Module._load (module.js:497:3)
    at Module.require (module.js:596:17)
    at require (internal/module.js:11:18)
    at loadConfig (/Users/jonathanpepin/next/node_modules/next/dist/server/config.js:47:28)
    at _callee2$ (/Users/jonathanpepin/next/node_modules/next/dist/build/index.js:52:42)
    at tryCatch (/Users/jonathanpepin/next/node_modules/regenerator-runtime/runtime.js:62:40)
    at Generator.invoke [as _invoke] (/Users/jonathanpepin/next/node_modules/regenerator-runtime/runtime.js:288:22)
    at Generator.prototype.(anonymous function) [as next] (/Users/jonathanpepin/next/node_modules/regenerator-runtime/runtime.js:114:21)
    at asyncGeneratorStep (/Users/jonathanpepin/next/node_modules/@babel/runtime-corejs2/helpers/asyncToGenerator.js:5:24)
    at _next (/Users/jonathanpepin/next/node_modules/@babel/runtime-corejs2/helpers/asyncToGenerator.js:27:9)
    at /Users/jonathanpepin/next/node_modules/@babel/runtime-corejs2/helpers/asyncToGenerator.js:34:7
error An unexpected error occurred: "Command failed.
Exit code: 1
Command: sh
Arguments: -c next build
Directory: /Users/jonathanpepin/next
Output:
".
info If you think this is a bug, please open a bug report with the information provided in "/Users/jonathanpepin/next/yarn-error.log".
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

the project only has 1 page

next (master) $ ls
next.config.js  node_modules    package.json    pages       yarn-error.log  yarn.lock

[Jauny]

cc @timneutkens

[baer]

It looks like the version up on NPM is not in sync with what's in this repo. That version just exports a single function. Until the new version is pushed, all you need to do to make this work is to not call it the first time as the readme shows.

module.exports = (nextConfig = {}) => {
  return Object.assign({}, nextConfig, {
    webpack(config, options) {
      if (!options.defaultLoaders) {
        throw new Error(
          'This plugin is not compatible with Next.js versions below 5.0.0 https://err.sh/next-plugins/upgrade'
        )
      }
...

[marklawlor]

Is there a reason why this hasn't been published? The NextJS docs/tutorials and google results all link to this repo's README which doesn't make it immediately obvious that it is a canary version.

[mac-deviget]

I am waiting too...
@marklawlor did you find a way to configure hidden-source-map in production?

[tastafur]

The error that is not a function keeps happening

[iShawnWang]

npm install @zeit/[email protected] works fine ~

[jasonwr]

It would be awesome to have this in the main next-source-maps. Please oh please make this happen.

[corysimmons]

@timneutkens Please publish the correct version to NPM.

[andi1984]

npm install @zeit/[email protected]

~For me this seems to break functionality @zeit/next-css~

withCSS has to be executed on the result of withSourceMaps.

[gecko25]

its been months can we get the right version published

[drewlustro]

@timneutkens please sir

[JoaoFGuiomar]

@iShawnWang Thanks! This helped.

Giving this thread another bump 🍻

[olaj]

I had an issue with this as well. Has just spent hours trying to configure some environment variables.

module.exports = withCSS( withSourceMaps({ env: { DEPLOY_ENV: process.env.DEPLOY_ENV } }) );

Nothing seemed to work. But then when i removed the "withSourceMaps" it suddenly started to work.

module.exports = withCSS({ env: { DEPLOY_ENV: process.env.DEPLOY_ENV } });

[jasonwr]

I had an issue with this as well. Has just spent hours trying to configure some environment variables.

module.exports = withCSS( withSourceMaps({ env: { DEPLOY_ENV: process.env.DEPLOY_ENV } }) );

Nothing seemed to work. But then when i removed the "withSourceMaps" it suddenly started to work.

module.exports = withCSS({ env: { DEPLOY_ENV: process.env.DEPLOY_ENV } });

Yeah but how does that get you source map support?

[JoaoFGuiomar]

@olaj Well you just removed the withSourceMaps so I guess withSourceMaps wont be a problem anymore... but it also won't generated sourcemaps for your project.

[jasonwr]

@olaj I agree with @JoaoFGuiomar You're not fixing the problem per our discussion. Rather than tip toe around the issue please add something that's constructive. We can all see that you just removed it. Now if you added a workaround to get source maps to work that's a different story but since you didn't mention that I'm going to have to presume you don't have a working solution for source maps with NextJS.

[olaj]

Sorry. I just wanted to add this to the discussion if someone else had the same issue. Maybe it was the wrong place to add it but if i had seen this when i was debugging this i would have saved a couple of hours of my time.

It will of course not fix the source maps issues but it point out that withSourceMaps is broken and also are causing side issues that aren't that easy to debug.

But please feel free to remove this if you are a moderator.

[JoaoFGuiomar]

I managed to get sourcemaps working and upload them to sentry using a webpack plugin.
I made a post in this thread with eveything I did. Hopefuly this will help someone.

https://spectrum.chat/next-js/general/config-nextjs-sourcemaps-in-sentry~630c66f8-69b4-41bf-8cad-98590b782322?m=MTU3NDQzNDM1MDA4NQ==

[Seybo]

i have this problem only in local production (next build && next start -p 3001). And to make it work i just remove the require invocation
const withSourceMaps = require('@zeit/next-source-maps')
instead of
const withSourceMaps = require('@zeit/next-source-maps')()

[timneutkens]

Closing in favor of https://github.com/vercel/next.js/pull/20267