It's difficult to track this down, so thanks for bearing with me. Some users were complaining that our site was broken in IE11. The app is using nextjs 3.0.1 and webpack 2.7.0.
Debugging in development mode
I think I have an issue similar to Angular RxJs timer pausing on IE11. I'm getting an error from a reference called webpack///webpack bootstrapxxxxxxxxxx (where the x's are some numbers in hex) in IE11.
Here's the function that's causing the issue:
// The require function function __webpack_require__(moduleId) { // Check if module is in cache if(installedModules[moduleId]) { return installedModules[moduleId].exports; } // Create a new module (and put it into the cache) var module = installedModules[moduleId] = { i: moduleId, l: false, exports: {}, hot: hotCreateModule(moduleId), parents: (hotCurrentParentsTemp = hotCurrentParents, hotCurrentParents = [], hotCurrentParentsTemp), children: [] }; // Execute the module function var threw = true; try { modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId)); threw = false; } finally { if(threw) delete installedModules[moduleId]; } // Flag the module as loaded module.l = true; // Return the exports of the module return module.exports; } The line modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId)); throws the error Unable to get property 'call' of undefined or null reference.
I imagine this is due to a missing polyfill, so I followed the advice at https://github.com/zeit/next.js/issues/1254 and added this to next.config.js (the webpack config for next):
const originalEntry = config.entry config.entry = function () { return originalEntry() .then((entry) => { Object.keys(entry).forEach(k => { entry[k].unshift('babel-polyfill') }) console.log(entry) return entry }) } I'm still seeing the same error.
Additional details in production
One thing that's interesting is that I have a different issue in the production version of the nextjs app. It's deep in the app.js file generated by next, but the error seems to come from this line https://github.com/ianstormtaylor/heroku-logger/blob/master/src/index.js#L12:
const { LOG_LEVEL, NODE_ENV, } = process.env It's throwing Expected identifier. Is this because the module isn't getting transpiled from ES6 to ES5 correctly? There's probably an underlying issue (that I saw in development), rather than a problem with the heroku-logger library.
Realize this is a complicated issue and I'm probably missing some details. Thanks in advance for your help!