Angular 2 - 无法动态转换 ES 模块，angular2-google-map-auto-complete

Question

我正在从事一个 Angular 项目。我正在为谷歌位置自动完成功能使用 angular2-google-map-auto-complete 模块。为此，我在 Systemjs.config.js 中包含了以下几行

            var map ={ 'angular2-google-map-auto-complete' : 'node_modules/angular2-google-map-auto-complete'};
            var packages = {'angular2-google-map-auto-complete' : {defaultExtension:'js'}};

但是在启动 npm 服务器时，我在控制台上收到以下错误。

Error: Unable to dynamically transpile ES module
   A loader plugin needs to be configured via `SystemJS.config({ transpiler: 'transpiler-module' })`.
  Instantiating http://localhost:3000/node_modules/angular2-google-map-auto-complete/directives/googleplace.directive.js
  Loading http://localhost:3000/app/app.module.js
  Loading main.js
    at transpile (instantiate.js:463)
    at instantiate.js:241
    at ZoneDelegate.invoke (zone.js:365)
    at Zone.run (zone.js:125)
    at zone.js:760
    at ZoneDelegate.invokeTask (zone.js:398)
    at Zone.runTask (zone.js:165)
    at drainMicroTaskQueue (zone.js:593)
    at <anonymous>

我们将不胜感激。

Answer 1

经过研究，我找到了解决方案。我刚刚安装了 babel 插件。

npm i systemjs-plugin-babel 

然后更新了systemjs.config.js文件。

SystemJS.config({
  map: {
    'plugin-babel': 'path/to/systemjs-plugin-babel/plugin-babel.js',
    'systemjs-babel-build': 'path/to/systemjs-plugin-babel/systemjs-babel-browser.js'
  },
  transpiler: 'plugin-babel'
});

重新启动 npm 及其工作。