[英]Load JavaScript file in angular2 app
我正在使用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
。 所以我的下一步是像這樣從我的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
文件。 但我仍然收到Error: (SystemJS) 'PluginMap' is undefined
。
如何/在何處加載生成的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
現在看來可行。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.