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

时间:2015-08-01 17:06:14

标签: babeljs es6-module-loader

我正在移植一个使用来自traceur的System.import到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个文件?

1 个答案:

答案 0 :(得分:0)

根据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';                                                                        
  });                                                                                              
}