我正在研究用TypeScript编写的angular2应用程序。
我有一个名为plugin-map.ts
的模块,它看起来像这样:
import { Type } from '@angular/core';
import { SomeComponent } from './plugins/some.component';
export const PluginMap: { [key: string]: Type<any> } = {
'e690bec6-f8d1-46a5-abc4-ed784e4f0058': SomeComponent
};
它被转换为plugin-map.js
,看起来像这样:
"use strict";
var some_component_1 = require('./plugins/some.component');
exports.PluginMap = {
'e690bec6-f8d1-46a5-abc4-ed784e4f0058': some_component_1.SomeComponent
};
//# sourceMappingURL=plugin-map.js.map
在其他模块中,我正在导入PluginMap
,如下所示:
import { PluginMap } from './plugin-map';
现在我想在服务器启动时在运行时创建plugin-map.js
。所以我想摆脱我的plugin-map.ts
,而只有一个(生成的)plugin-map.js
。而且我不想对plugin-map.js
。
在我需要访问PluginMap
的模块中,我用这样的声明替换了import
语句:
declare const PluginMap: { [key: string]: Type<any> };
现在当然在运行时我得到一个Error: (SystemJS) 'PluginMap' is undefined
。因此,我的下一步是明确地从我的plugin-map.js
加载index.html
:
...
<script src="js/system.src.js"></script>
<script src="systemjs.config.js"></script>
<script>
System.import('./app/plugins/plugin-map.js').catch(function (err) { console.error(err); });
System.import('app').catch(function(err){ console.error(err); });
</script>
...
当我启动我的应用程序时,我可以看到浏览器实际上请求plugin-map.js
文件。但我仍然得到Error: (SystemJS) 'PluginMap' is undefined
。
我如何/在哪里加载生成的plugin-map.js
以便这样做?
答案 0 :(得分:1)
我必须确保PluginMap在全局上下文中可用。因此生成的plugin-map.js
必须如下所示:
var some_component_1 = require('./plugins/some.component');
PluginMap = {
'e690bec6-f8d1-46a5-abc4-ed784e4f0058': some_component_1.SomeComponent
};
而不是这样:
"use strict";
var some_component_1 = require('./plugins/some.component');
exports.PluginMap = {
'e690bec6-f8d1-46a5-abc4-ed784e4f0058': some_component_1.SomeComponent
};
//# sourceMappingURL=plugin-map.js.map
现在它似乎有效。