无法读取未定义的Webpack Bootstrap React的属性“调用”

Nap*_*tir 5 javascript twitter-bootstrap reactjs webpack webpack-dev-server

我遇到了一个发现其他人也遇到过的问题。我遇到的唯一问题是,我发现的所有解决方案似乎都不适合我。当我构建项目时,一切都会成功而没有错误。然后webpack-dev-server,我在dist文件夹中开始构建的项目。当我打开浏览器时,出现以下错误: 开发工具错误日志

现在webpack-dev-server在开发模式下运行时不会发生这种情况。简单的解释是因为我没有在webpack.config.dev.js文件中执行任何代码拆分。所以我知道问题出在我的电脑上CommonsChunkPlugin。我无法确切说明原因。这是我正在处理的仓库的链接: Nappstir / react-landing-page。这个项目没有什么复杂的。我只是尝试为将要内置的基本目标网页构建模板React,因此没有Redux接线。关于什么可能导致此错误的任何想法?

您可以克隆此项目,然后简单地运行npm installnpm run build构建该项目。然后只需访问' http:// localhost:3000 / `

Nap*_*tir 2

我实际上找到了发生此错误的原因。看来问题与我的html-webpack-plugin注入文件的文件顺序有关。解决这个问题的方法是使用提供的chunks&属性。代码看起来像这样:chunksSortModehtml-webpack-plugin

chunks: ['manifest', 'vendor', 'main'],
chunksSortMode: function (a, b) {
  let orders = ['manifest', 'vendor', 'main'];
  if (orders.indexOf(a.names[0]) > orders.indexOf(b.names[0])) {
    return 1;
  } else if (orders.indexOf(a.names[0]) < orders.indexOf(b.names[0])) {
    return -1;
  } else {
    return 0;
  }
},
Run Code Online (Sandbox Code Playgroud)

然后,这将按数组的指定顺序返回每个块chunks