Javascript 进口（）工厂

我正在我的应用程序中使用ES6代码拆分。很好！但是，我不喜欢使用很多样板代码

这可能是一个新手问题，但有人能向我解释一下为什么会这样：

export const Router = () => {
  return (
    <ReactRouter history={Context.Router}>
      <Route path={"/"}
             getComponent={(location, cb) => {
               import('/imports/modules/companies/index')
                 .then(module => {
                   cb(null, module.default.Component)
                 });
             }} />
    </ReactRouter>
   );
}

export const Router=（）=>{
返回(
{
导入（“/imports/modules/companys/index”）
。然后（模块=>{
cb（空，module.default.Component）
});
}} />
);
}

但以下措施不起作用：

function getModuleComponent(name) {
  return (location, cb) => {
    import(`/imports/modules/${name}/index`)
      .then(module => {
        cb(null, module.default.Component)
      });
  }
}

export const Router = () => {
  return (
    <ReactRouter history={Context.Router}>
      <Route path={"/"}
             getComponent={getModuleComponent('companies')} />
    </ReactRouter>
   );
}

函数getModuleComponent（名称）{ 返回（位置，cb）=>{ 导入（`/imports/modules/${name}/index`） 。然后（模块=>{ cb（空，module.default.Component） }); } } 导出常量路由器=（）=>{ 返回( ); } 事实上，我会得到一个错误：

未捕获（承诺中）错误：找不到模块“/imports/modules/companys/index”

…这说明我正在尝试导入正确的文件。但由于某种原因，import（）无法“找到”它

请注意，异常中命名的模块与第一个示例中使用的字符串完全相同。因此，两次调用imports（）时使用的参数都是完全相同的环境中的参数。但是第二个会抛出异常，而第一个不会

---

另外，虽然我似乎不太可能认为这是原因，但我应该注意到，我在Meteor（v1.6）环境中经历了这一点

这一行的打字错误：

getComponent={getModuleComponent（'companys'）}

是否存在于您的实际代码中？在

'companys'

之后缺少一个paranthee。没有。但是很好。代码运行良好-在这两种情况下。不工作的代码可以很好地访问imports（）语句（你所说的错误是不会发生的）。我刚刚得到一个明显的例外。我已经更新了示例。好的，还有一个问题。为什么在第一个示例中导入

/imports/modules/app/index

，而在第二个示例中导入

/imports/modules/companys/index

？剪切粘贴错误…还有另一个很好的问题。我当前的代码库正在加载我们每个基于路由器的模块使用工作方法（如上所示）。我只尝试过将其中一个转换为备选方案（如图所示）。我确实尝试过使用完全相同的模块名称。（例如，当我将“公司”代码从一个备选方案替换为下一个备选方案时。）您是否可以尝试执行

getModuleComponent.call（这是“公司”）

？