Edge babel regenerator runtime usage can break client/server specific requires #9298
Comments
|
I found a temporary workaround for now: static getInitialProps () {
if (typeof window === 'undefined') {
return (async () => {
require('../asdf')
// do async stuff with asdf
return { asdf: 'test1' }
})()
}
} |
|
It might be possible to use static async getInitialProps () {
if (!process.browser) {
require('../asdf')
return { asdf: 'test1' }
}
}This is defined at build time so it should exclude it from the client build. See here: https://github.com/zeit/next.js/blob/21f0db8181ed1fd10b5b6ea92ca7b9415fcb2242/packages/next/build/webpack-config.ts#L781 |
|
I tested it and that works the same as |
|
Hi, it looks like this is due to the way the babel regenerator runtime transforms the client side code. If you move the if (typeof window !== 'undefined') {
require('../asdf')
}
return {}This is what the regenerator runtime transforms the var _getInitialProps = _asyncToGenerator(
/*#__PURE__*/
regeneratorRuntime.mark(function _callee() {
return regeneratorRuntime.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
if (!(typeof window === 'undefined')) {
_context.next = 3;
break;
}
require('hello');
return _context.abrupt("return", {
asdf: ''
});
case 3:
case "end":
return _context.stop();
}
}
}, _callee);
}));From the above investigating I'm not sure this would be considered a Next.js bug 🤔 |
ijjk
changed the title
|
Interesting, thanks for the workaround. I'll look into it a bit more and maybe submit it as a bug to regenerator-runtime if needed. |
|
It seems to be a little more complex than just moving the return statement outside of the if statement. Even this code causes an error: static async getInitialProps(ctx: NextPageContext) {
if (typeof window === 'undefined') {
require('fs')
} else {
try {
user = await axios.get('/api/user')
} catch (e) {
if (e && e.response && e.response.data && e.response.data.error) {
Router.push('/login')
}
}
}
return {}
}With this generated: var _getInitialProps = Object(_babel_runtime_corejs2_helpers_esm_asyncToGenerator__WEBPACK_IMPORTED_MODULE_1__["default"])(
/*#__PURE__*/
_babel_runtime_corejs2_regenerator__WEBPACK_IMPORTED_MODULE_0___default.a.mark(function _callee(ctx) {
var user;
return _babel_runtime_corejs2_regenerator__WEBPACK_IMPORTED_MODULE_0___default.a.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
if (true) {
_context.next = 4;
break;
}
__webpack_require__(/*! axios */ "./node_modules/axios/index.js");
_context.next = 13;
break;
case 4:
_context.prev = 4;
_context.next = 7;
return axios__WEBPACK_IMPORTED_MODULE_8___default.a.get('/api/user');
case 7:
user = _context.sent;
_context.next = 13;
break;
case 10:
_context.prev = 10;
_context.t0 = _context["catch"](4);
if (_context.t0 && _context.t0.response && _context.t0.response.data && _context.t0.response.data.error) {
next_router__WEBPACK_IMPORTED_MODULE_9___default.a.push('/login');
}
case 13:
return _context.abrupt("return", {
u: user
});
case 14:
case "end":
return _context.stop();
}
}
}, _callee, null, [[4, 10]]);
})); |
|
Closing as this is upstream and only one user ran into it: facebook/regenerator#380 |
|
This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you. |
Bug report
Describe the bug
An async
getInitialPropswith a require statement requiring server-side code includes the server side code on the client side, crashing the application.To Reproduce
Example repository: https://github.com/meyer9/next-async-import-bug
Expected behavior
It should properly split the server code and not include or run the module on the client.
Log
The text was updated successfully, but these errors were encountered: