Reactjs 为什么网页代码拆分对我不起作用？

我正在使用require.conference在react router路径上创建拆分点。但是，除了

vendor.js

之外，我的构建目录仍然只有

app.js

。我希望我使用的每个路径都有一个单独的js文件

我使用了

require。请确保在每个路径上都像这样使用
：

<Route path= 'auth' getComponent={(nextState, callback) => {
  require.ensure([], (require) => {
    callback(null, require('containers/Authenticate/AuthenticateContainer.js').default)
  }, 'auth')
}}/>

require.ensure(['containers/Authenticate/AuthenticateContainer.js'], (require) => {
      callback(null, require('containers/Authenticate/AuthenticateContainer.js').default)
    }, 'auth');

下面是我和我的全部的GIST

更新：我发现自己做错了什么。我的容器项目结构如下所示：

-app
 -containers
   -containerA.
     -containerA.js
   -containerB
     -containerB.js
   -containerC
     -containerC.js
   -index.js

问题：我仍然在导出routes文件中需要的容器，如：export containerB from./containerB/containerB'
删除index.js中的导出并直接从containerB.js中请求，成功了。
确保获取所需模块的参数数组。您需要为数组提供希望动态加载的模块名称。在您的情况下，请提供“containers/Authenticate/AuthenticateContainer.js”以确保：

<Route path= 'auth' getComponent={(nextState, callback) => {
  require.ensure([], (require) => {
    callback(null, require('containers/Authenticate/AuthenticateContainer.js').default)
  }, 'auth')
}}/>

require.ensure(['containers/Authenticate/AuthenticateContainer.js'], (require) => {
      callback(null, require('containers/Authenticate/AuthenticateContainer.js').default)
    }, 'auth');

我在我的一个项目中遇到了同样的问题：我们使用Systemjs并决定切换到Webpack，因此它破坏了我们的System.import。我们通过替换以下内容来解决此问题：

System.import(modulePath)
  .then(module => {
    // Do things
  })

与：

new Promise((resolve, reject) => {
    resolve(require(modulePath));
}).then((module) => { 
  // Do things 
});

希望这有帮助
我正在使用webpack 1.13.1，这是我的配置

output: {
        path: PATHS.build,
        filename: '[name].[hash].js',
        publicPath:"/"
    },

下面是get组件的代码

const lazyLoadSomeComponent = () => {
  return {
      getComponent: (location, callback)=> {
        require.ensure([], require => {
          callback(null, require("./componentpath")["default"]);
        }, 'componentName');
      }
    }
};

然后在途中

<Route path="somepath" {...lazyLoadSomeComponent()} />

然后在路线上

<Route path="somepath" {...LazyComponents('Component1')} />


添加对构建目录没有任何影响。我是否需要在网页配置中包含一些内容才能使其正常工作。如果您逐字复制，我在结尾处漏掉了一句话。不，您不需要配置任何其他内容。@jasan请告诉我们您需要配置什么happened@MitchKarajohn我还没有解决这个问题。我的一个选择是升级到Webpack2.0并使用新的system.imports，但这也需要我在配置中做很多其他更改。所以我暂缓了。Richard，我没有使用Webpack2.0。我使用的是他们最新的稳定版本。系统导入不是只针对webpack 2.0，require.Sure在早期版本的webpack中使用。是的，它破坏了我们的应用程序。所以我们用一个等价的using promises（我评论中的第二个代码）来代替它。Richard，你能用react路由器路由的例子来发布一个要点吗。不清楚。