Next.js: [2.0-beta.17] HMR bundle has errors: exports is not allowed in EcmaScript module

[Zaiban]

Got the following error after updating to beta 17:

Any clue to what might cause this?

[nkzawa]

It looks this warning was added on [email protected] which we introduced on beta 17.

Actually, it seems this is a bug of webpack since these modules (lodash-es/_cloneBuffer etc) don't use exports, but just check existence of it like typeof exports == 'object' && exports.

[nkzawa]

This is it. https://github.com/webpack/webpack/issues/3917

[nkzawa]

Anyway, I don't think lodash-es properly works since you can't use it on Server Side (no webpack compilation) for now.

[arunoda]

@nkzawa what's our plan for this?
If they didn't fix this sooner, are we going to revert back to the previous version? (Bring back our dynamic entry plugin stuff?)

[nkzawa]

I think we don't have to revert since import/export statements don't work on server anyway.

[arunoda]

@Zaiban FYI: You need to the normal version lodash instead of lodash-es

[Zaiban]

Actually I'm already using the normal lodash. Maybe this comes from a dependency? Need to do some digging.

[Zaiban]

Well grepping for lodash-es reveals that redux-form, react-redux and babel-plugin-lodash all have lodash-es as a dependency. Tried to disable the babel plugin already but no effect. And getting rid of redux-form and react-redux is not really a valid option at this point :/

[arunoda]

@Zaiban That's a valid question.
I think we need to make issues for different upstream libraries for this.

EDIT: Anyway, I assume webpack will actually fix this issue.

[arunoda]

@nkzawa about the lodash-es.
I think it works fine for us.
This is how people use it.

They use it with the module target in package.json.
See how react-redux does it.

So, it only picks by webpack. For node, it still uses the main target and it works fine.
I didn't test this, but it should work fine.

[nkzawa]

Updated webpack https://github.com/zeit/next.js/commit/da8395883c52588f572c0515ea208b5a20d773e8