我正在开发一个用 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> };
现在,当然在运行时我收到一个错误:(SystemJS) 'PluginMap' 未定义
。因此,我的下一步是从我的 index.html
显式加载 plugin-map.js
,如下所示:
...
<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
文件。但我仍然收到错误:(SystemJS) 'PluginMap'未定义
。
问题:
我必须如何/在哪里加载生成的 plugin-map.js
才能正常工作?
最佳答案
我必须确保 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
现在看来可以了。
关于javascript - 在 angular2 应用程序中加载 JavaScript 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41447135/