3

很难追查到这一点,所以感谢您对我的包容。一些用户抱怨我们的网站在 IE11 中被破坏。该应用程序使用 nextjs 3.0.1 和 webpack 2.7.0。

在开发模式下调试

我想我有一个类似于Angular RxJs timer pause on IE11的问题。我从 IE11 中名为 webpack///webpack bootstrapxxxxxxxxxx(其中 x 是一些十六进制数字)的引用中收到错误。

这是导致问题的函数:

// 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;
}

该行modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));抛出错误Unable to get property 'call' of undefined or null reference

我想这是由于缺少 polyfill,所以我遵循了https://github.com/zeit/next.js/issues/1254的建议并将其添加到 next.config.js (下一个的 webpack 配置):

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
    })
}

我仍然看到同样的错误。

生产中的其他细节

有趣的一件事是我在 nextjs 应用程序的生产版本中有一个不同的问题。它在 next 生成的文件中很深app.js,但错误似乎来自这一行https://github.com/ianstormtaylor/heroku-logger/blob/master/src/index.js#L12

const {
  LOG_LEVEL,
  NODE_ENV,
} = process.env

它在扔Expected identifier。这是因为模块没有正确地从 ES6 转换到 ES5 吗?可能有一个潜在的问题(我在开发中看到),而不是heroku-logger库的问题。

意识到这是一个复杂的问题,我可能遗漏了一些细节。在此先感谢您的帮助!

4

1 回答 1

0

万一其他人对此感到困惑,我将其留babel-polyfill在 webpack 配置中并将build命令更改为:

next build && babel .next/*.js --out-dir . --presets=es2015,react

这非常笨拙,因为一些代码由 webpack 进行了 babel 化,然后又在输出目录中。会喜欢其他建议!

于 2017-07-28T17:11:11.520 回答