Next.js: undefined is not an object (evaluating 'modules[moduleId].call')

[nagman]

Bug report

Describe the bug

When I'm running my next.js website on my local environment (only on local), and I try to access a page other than the homepage on an Apple device (Safari for desktop or anything on iOS), I get this error:
undefined is not an object (evaluating 'modules[moduleId].call')

This is very very very specific as you can see.

Actually it doesn't really bother me as it's only hapenning in dev mode.
And I don't develop on Apple devices.

Screenshots

System information

• OS: iOS 11.4.1
• Browser: Chrome, Safari
• Version of Next.js: 6.1.2

[jackypan1989]

it's resolved by updating to latest canary version

[janustoth]

@jackypan1989 : I just upgraded to the latests canary and I still get this error. I think it is only in dev mode and it seems related to the withsass plugin

[jackypan1989]

I also updated with-css / with-less too

[timneutkens]

Please provide a reproduction when creating issues.

[mmiszy]

I also experienced this today after upgrading to the latest version of Next.js. Strangely enough, the error was gone after I invalidated the service worker using devtools.

[abhinayar]

Experiencing the same issue though only in Safari (out of Chrome, FF, and Safari). Super strange, already using the Canary. Can someone advice on what the cause is? Haven't deployed the app with the error yet but concerned about deploying this to production...

[abhinayar]

Little update: It seems to only be occurring on the initial SSR render, once you go client side then does not occur anymore. Also for me, it primarily occurs on pages where there is a list of items being stored in page state (not sure if this is it?) and a map function being called

[timneutkens]

I guess this issue can be closed as not reproducible as per my comment earlier: https://github.com/zeit/next.js/issues/5302#issuecomment-425060032

[janustoth]

Hi @timneutkens. I had to downgrade next because of this issue. Later when I have time I might find out what causes it and report it back here but it certainly still exists and makes it impossible to use next 7 so I think closing it might be premature.

[abhinayar]

Still a big issue on Safari. I don't have time to reproduce it right now. Please do not close this.

[abhinayar]

Downgraded to Next 6.1.1 and still having the issue. I'll stop spamming this thread but just wanted to put that out there, not limited to Next 7. Another fact, using next-sass and these packages:

[janustoth]

My current guess is that this happens when you combine sass with absolute imports. Any of you doing that? Right now it is just a guess.

[nagman]

Tested without !important on the only element that had both position: absolute and !important (on the max-width property). Still doesn't work.

[janustoth]

Tested without !important on the only element that had both position: absolute and !important (on the max-width property). Still doesn't work.

Hi @nagman! I meant absolute imports. Sorry about the typo. So what I means is that either doing something like this: https://github.com/zeit/next-plugins/tree/master/packages/next-sass#with-sass-loader-options, or like this: https://github.com/zeit/next.js/tree/canary/examples/with-absolute-imports

It is my bad. I guess I could have been more awake this morning.

[nagman]

@janustoth Haha, I wondered why you asked this!
Yes I do use absolute imports, like so:

@import 'variables';

In top of each of my .scss files.

[janustoth]

@janustoth Haha, I wondered why you asked this!
Yes I do use absolute imports, like so:

@import 'variables';

In top of each of my .scss files.

@nagman I used it the exact same way. Often I have an issue when I navigate between pages where the styles do not get loaded until I refresh. It only happens in dev mode. I think it is this same issue that is crashing the app when I upgrade. Have you seen something similar?

[timneutkens]

As per https://github.com/zeit/next.js/issues/5302#issuecomment-428145987

Also this is probably a duplicate of other issues.

[janustoth]

As per #5302 (comment)

Also this is probably a duplicate of other issues.

Hi @timneutkens,
That sounds interresting. Would you mind mentioning these issues that this is a dublicate of, so I we can keep up with the progress?

[akotlar]

Same issue, nextLess + nextCss, only on the page with a list of items generated using .map inside the render() method. Safari 12.0.

Seems to be related to some cached values, that persist between refreshes. A solution is to close the problematic window, open a new window and reload.

[mtford90]

In our case I've narrowed this issue down to the use of scss :export to expose variables in scss land to JS land. @janustoth, @nagman perhaps you're using this too?

We experience two issues actually:

1. The error as described above.
2. Missing styles when moving between pages (but not always)

This only happens in dev with hmr on safari (mobile & desktop).

I've created a minimal repo that reproduces this issue @timneutkens. You can reproduce by running npm run dev and then simply moving between pages on Mac OS X Safari or iOS Safari. You'll see the error pop up in the usual error modal.

The repo is here: https://github.com/mtford90/next-js--5302-minimal-reproduction

[nagman]

@mtford90 I'm not using :export, I don't even knew what it was.

[janustoth]

@mtford90: I am not using this typings-for-css-modules-loader. I assume that is what you mean with :export?

[qhxin]

i had the same problem, and i think webpack HMR change relation failed caused this problem...

[alexsenichev]

Same with me

[madleo-dk]

Experiencing the same.
I have the PostCSS plugin in my next.config.js

// next.config.js
const withSass = require('@zeit/next-sass')
module.exports = withSass()

To confirm, this bug only exists in dev? Anyone experienced this persist to prod?

[nazywamsiepawel]

+1, same here, I'm using both withLess and withCss, next version 7.0.2