es6-module-loader 找不到没有 .js 扩展名的模块答案

【问题标题】：es6-module-loader cannot find module without .js extensiones6-module-loader 找不到没有 .js 扩展名的模块
【发布时间】：2015-08-01 17:06:14
【问题描述】：

我正在将一个使用 System.import 的应用程序从 traceur 移植到 Babel。我的简化 HTML 如下所示：

<script src="../node_modules/babel-core/browser.js"></script>
<script src="../node_modules/es6-module-loader/dist/es6-module-loader-dev.js"></script>
<script> 
    System.transpiler = 'babel';
    System.import('./css');
</script>

这给了我

Uncaught (in promise) File not found: http://connect:8000/sam/css
    Error loading http://connect:8000/sam/css

如果我指定./css.js，并使用.js 扩展名，它可以工作。但是，然后在css.js 内部以及整个系统中导入表单

import 'foo';

失败。

似乎 es6-module-loader 想要 .js 扩展名。我注意到some commit in es6-module-loader 涉及演示页面，该页面将.js 扩展名添加到导入名称。在this page，我也看到了

.js 扩展名也不再默认添加。这些更改是过渡到新规范工作的一部分。有关详细信息，请参阅 whatwg/loader#52 的讨论。如果需要，可以使用自定义挂钩轻松添加 .js 扩展名。

但我不知道指的是哪种钩子，也不知道怎么写。

我知道在浏览器中动态加载和转译可能并不理想，也不是一种强大的生产方法。但是，这个特定的应用程序会动态加载单个 ES6 文件，我暂时需要坚持这样做。

我的问题是：es6-module-loader 是否需要 .js 扩展名，或者有什么方法可以告诉它默认查找 .js 文件？

【问题讨论】：

标签： babeljs es6-module-loader

【解决方案1】：

根据https://github.com/ModuleLoader/es6-module-loader/blob/master/docs/loader-extensions.md 的文档，我最终覆盖了locate 钩子：

var systemLocate = System.locate;                                                                  
System.locate = function(load) {                                                                   
  var System = this; // its good to ensure exact instance-binding                                  
  return Promise.resolve(systemLocate.call(this, load)).then(function(address) {                   
    return address + '.js';                                                                        
  });                                                                                              
}

【讨论】：