Javascript IE11中的网页包突破

Javascript IE11中的网页包突破,javascript,webpack,ecmascript-6,babeljs,nextjs,Javascript,Webpack,Ecmascript 6,Babeljs,Nextjs,很难找到这个,所以谢谢你对我的支持。一些用户抱怨我们的网站在IE11中被破坏。该应用程序正在使用nextjs 3.0.1和webpack 2.7.0 开发模式下的调试 我想我有一个类似的问题。我从IE11中一个名为webpack///webpack bootstrapxxxxxxxxx(其中x是一些十六进制数字)的引用中得到一个错误 以下是导致问题的函数: // The require function function __webpack_require__(moduleId) {

很难找到这个,所以谢谢你对我的支持。一些用户抱怨我们的网站在IE11中被破坏。该应用程序正在使用nextjs 3.0.1和webpack 2.7.0

开发模式下的调试 我想我有一个类似的问题。我从IE11中一个名为webpack///webpack bootstrapxxxxxxxxx(其中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]。调用(module.exports,module,module.exports,hotCreateRequire(moduleId))
抛出错误
无法获取未定义或空引用的属性“call”

我想这是由于缺少polyfill,所以我按照上的建议将其添加到next.config.js(next的网页配置):

我仍然看到同样的错误

生产中的其他细节 有趣的是,我在nextjs应用程序的生产版本中遇到了一个不同的问题。它位于next生成的
app.js
文件的深处,但错误似乎来自这一行:

它正在抛出
预期标识符
。这是因为模块没有正确地从ES6传输到ES5吗?这可能是一个潜在的问题(我在开发中看到),而不是heroku logger库的问题


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

如果其他人对此感到困惑,我将
babel polyfill
留在网页配置中,并将
build
命令更改为:

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

这是相当笨拙的,因为有些代码是由webpack编译的,然后再次在输出目录中。希望有其他建议

该错误通常是包含模块的块未提供给客户端的结果。这通常是代码拆分的结果,尤其是在执行类似这样的动态导入时:
import(`./asyncComponents/${componentName}`)
。它是“动态”的,因为导入本身不是静态的,如下所示:
import('./Foo')
。动态版本在内部使用webpack的“上下文”功能,该功能实质上为
/asyncComponents
文件夹中的所有模块创建块。如果您正在执行动态导入,它实际上将不起作用——因为webpack还不支持基于其方法
require.resolve弱()
的服务器端版本。。所以这可能是你的问题,也可能是相关的问题。您使用的是Next.js,所以可能是他们做事方式中的一个缺陷。。。你能粘贴你正在进行代码拆分导入的代码吗?
const {
  LOG_LEVEL,
  NODE_ENV,
} = process.env
next build && babel .next/*.js --out-dir . --presets=es2015,react