问题标签 [systemjs]

我开始玩 angular2，并且在尝试创建一个依赖于位于其父位置的 angular 的组件时，例如，

我收到以下错误消息：

区域已在窗口对象上导出！

有人可以解释导致此问题的原因以及我该如何解决？

我正在使用 Typescript 1.5。我开始使用jspm。

我有一些只包含接口导出的文件。在我的 tsconfig 中，模块设置为“系统”。

它似乎不喜欢只是导出接口的文件。它给了我 404 错误，当它们位于它下面的子文件夹中时，在 dist/app 文件夹中寻找它们。似乎只发生在文件中只是接口。

我有接口的 JS 文件，它们位于正确的子文件夹中。我不确定为什么 JSPM 在基本 url 而不是子文件夹中寻找这些文件。我找不到任何可以说明原因的东西。它似乎只是接口文件。我确实注意到它为我的界面执行此操作。```

```，不知道有没有关系。我喜欢拥有名为 ISearch.ts 的接口文件，并且也不想将所有接口都粘贴在 1 个文件中。我的一些接口是从其他接口导入的。

这是一个示例接口文件。```

```

错误：

GET http://localhost:9238/app/ITransaction.js 404 (Not Found)f @ es6-module-loader.src.js:2612$__Object$defineProperty.value @ es6-module-loader.src.js:2787c @ es6-module-loader.src.js:377b @ es6-module-loader.src.js:365$__Object$defineProperty.value @ es6-module-loader.src.js:2786$__global.upgradeSystemLoader.e.fetch @ system.src.js:739$__global.upgradeSystemLoader.e.fetch @ system.src.js:1806$__global.upgradeSystemLoader.e.fetch @ system.src.js:1921(anonymous function) @ es6-module-loader.src.js:1525O @ es6-module-loader.src.js:1183K @ es6-module-loader.src.js:11427.y.when @ es6-module-loader.src.js:9307.v.run @ es6-module-loader.src.js:8213.a._drain @ es6-module-loader.src.js:973.a.drain @ es6-module-loader.src.js:62b @ es6-module-loader.src.js:268 es6-module-loader.src.js:2612 GET http://localhost:9238/app/ICalculateTransaction.js 404 (Not Found)f @ es6-module-loader.src.js:2612$__Object$defineProperty.value @ es6-module-loader.src.js:2787c @ es6-module-loader.src.js:377b @ es6-module-loader.src.js:365$__Object$defineProperty.value @ es6-module-loader.src.js:2786$__global.upgradeSystemLoader.e.fetch @ system.src.js:739$__global.upgradeSystemLoader.e.fetch @ system.src.js:1806$__global.upgradeSystemLoader.e.fetch @ system.src.js:1921(anonymous function) @ es6-module-loader.src.js:1525O @ es6-module-loader.src.js:1183K @ es6-module-loader.src.js:11427.y.when @ es6-module-loader.src.js:9307.v.run @ es6-module-loader.src.js:8213.a._drain @ es6-module-loader.src.js:973.a.drain @ es6-module-loader.src.js:62b @ es6-module-loader.src.js:268 es6-module-loader.src.js:2612 GET http://localhost:9238/app/ITenderButton.js 404 (Not Found)f @ es6-module-loader.src.js:2612$__Object$defineProperty.value @ es6-module-loader.src.js:2787c @ es6-module-loader.src.js:377b @ es6-module-loader.src.js:365$__Object$defineProperty.value @ es6-module-loader.src.js:2786$__global.upgradeSystemLoader.e.fetch @ system.src.js:739$__global.upgradeSystemLoader.e.fetch @ system.src.js:1806$__global.upgradeSystemLoader.e.fetch @ system.src.js:1921(anonymous function) @ es6-module-loader.src.js:1525O @ es6-module-loader.src.js:1183K @ es6-module-loader.src.js:11427.y.when @ es6-module-loader.src.js:9307.v.run @ es6-module-loader.src.js:8213.a._drain @ es6-module-loader.src.js:973.a.drain @ es6-module-loader.src.js:62b @ es6-module-loader.src.js:268 es6-module-loader.src.js:2612 GET http://localhost:9238/app/nav-actions/all.js 404 (Not Found)f @ es6-module-loader.src.js:2612$__Object$defineProperty.value @ es6-module-loader.src.js:2787c @ es6-module-loader.src.js:377b @ es6-module-loader.src.js:365$__Object$defineProperty.value @ es6-module-loader.src.js:2786$__global.upgradeSystemLoader.e.fetch @ system.src.js:739$__global.upgradeSystemLoader.e.fetch @ system.src.js:1806$__global.upgradeSystemLoader.e.fetch @ system.src.js:1921(anonymous function) @ es6-module-loader.src.js:1525O @ es6-module-loader.src.js:1183K @ es6-module-loader.src.js:11427.y.when @ es6-module-loader.src.js:9307.v.run @ es6-module-loader.src.js:8213.a._drain @ es6-module-loader.src.js:973.a.drain @ es6-module-loader.src.js:62b @ es6-module-loader.src.js:268 es6-module-loader.src.js:2612 GET http://localhost:9238/app/ISideNavSection.js 404 (Not Found)f @ es6-module-loader.src.js:2612$__Object$defineProperty.value @ es6-module-loader.src.js:2787c @ es6-module-loader.src.js:377b @ es6-module-loader.src.js:365$__Object$defineProperty.value @ es6-module-loader.src.js:2786$__global.upgradeSystemLoader.e.fetch @ system.src.js:739$__global.upgradeSystemLoader.e.fetch @ system.src.js:1806$__global.upgradeSystemLoader.e.fetch @ system.src.js:1921(anonymous function) @ es6-module-loader.src.js:1525O @ es6-module-loader.src.js:1183K @ es6-module-loader.src.js:11427.y.when @ es6-module-loader.src.js:9307.v.run @ es6-module-loader.src.js:8213.a._drain @ es6-module-loader.src.js:973.a.drain @ es6-module-loader.src.js:62b @ es6-module-loader.src.js:268 es6-module-loader.src.js:2612 GET http://localhost:9238/app/ISearch.js 404 (Not Found)f @ es6-module-loader.src.js:2612$__Object$defineProperty.value @ es6-module-loader.src.js:2787c @ es6-module-loader.src.js:377b @ es6-module-loader.src.js:365$__Object$defineProperty.value @ es6-module-loader.src.js:2786$__global.upgradeSystemLoader.e.fetch @ system.src.js:739$__global.upgradeSystemLoader.e.fetch @ system.src.js:1806$__global.upgradeSystemLoader.e.fetch @ system.src.js:1921(anonymous function) @ es6-module-loader.src.js:1525O @ es6-module-loader.src.js:1183K @ es6-module-loader.src.js:11427.y.when @ es6-module-loader.src.js:9307.v.run @ es6-module-loader.src.js:8213.a._drain @ es6-module-loader.src.js:973.a.drain @ es6-module-loader.src.js:62b @ es6-module-loader.src.js:268 es6-module-loader.src.js:2612 GET http://localhost:9238/app/INavAction.js 404 (Not Found)f @ es6-module-loader.src.js:2612$__Object$defineProperty.value @ es6-module-loader.src.js:2787c @ es6-module-loader.src.js:377b @ es6-module-loader.src.js:365$__Object$defineProperty.value @ es6-module-loader.src.js:2786$__global.upgradeSystemLoader.e.fetch @ system.src.js:739$__global.upgradeSystemLoader.e.fetch @ system.src.js:1806$__global.upgradeSystemLoader.e.fetch @ system.src.js:1921(anonymous function) @ es6-module-loader.src.js:1525O @ es6-module-loader.src.js:1183K @ es6-module-loader.src.js:11427.y.when @ es6-module-loader.src.js:9307.v.run @ es6-module-loader.src.js:8213.a._drain @ es6-module-loader.src.js:973.a.drain @ es6-module-loader.src.js:62b @ es6-module-loader.src.js:268 es6-module-loader.src.js:140 Potentially unhandled rejection [3] Error loading "ITransaction" at http://localhost:9238/app/ITransaction.js Error loading "ITransaction" from "boot" at http://localhost:9238/app/boot.js Not Found: http://localhost:9238/app/ITransaction.js (WARNING: non-Error used)

我在使用 Angular2 和 SystemJS 运行以下版本的 JSPM 时遇到以下问题（版本：Angular@2.0.0-alpha.27 和 JSPM@0.16.0-beta.2 和 SystemJS@0.18.0）一旦打字稿是编译（没有错误）我在浏览器中收到以下错误：

现在，当我手动包含文件 Reflect.js: \jspm_packages\npm\reflect-metadata@0.1.0\Reflect.js 时，问题就消失了，但下一个问题出现了，说列表在另一个角度文件中未定义。

有关 system.js 和 typescript / jspm.io 的配置文件（src 代码），请参见下面的 bitbucket src

https://bitbucket.org/schippie/angular-2-jspm-hello-world/src/8af83f2066e5e3e9eede7db495545234f3b0c04a

我想知道的是，目前是否可以将 jspm 与 system.js 一起使用来检索 angular 正常运行所需的所有 angular 包。看到 system.js 的配置确实清楚地表明 angular 取决于它：

但它们没有被检索到（查看网络选项卡）

将TypeScript与SystemJS一起使用，我如何使用导入JSON文件plugin-json？

如果我写System.import('myjson.json!json').then(...)，那么它会异步导入它，而不是作为System.register([...]).

那么，如何将 JSON 文件导入System.register([...])并说服TypeScript同意这一点？（无then 承诺语法）。

注意： 我正在使用tsc标志-m system

更新：

一个可能的解决方案是使用-m umd选项 fortsc而不是-m system，然后我可以执行以下操作：

但是，仍在等待有关-m system.

我在内部开发服务器上安装了 GitLab。我想在开发过程中将它用作 jspm 的分发端点。可以定义您在 JSPM 中使用哪个 git 服务器，或者是否有其他方法可以使用来自私有源的包？

我们正在考虑将我们的一些 Angular 项目转移到 typescript 并在内部模块/命名空间方面遇到一些问题。

我们在 github 上发布了这个工作示例： https ://github.com/hikirsch/TypeScriptSystemJSAngularSampleApp

脚步：

这是应用程序的要点：index.ts

示例Ctrl.ts

ExampleTwoCtrl.ts

如前所述，这一切都很好。但我们宁愿将所有东西都放在这样的命名空间下：

然后像这样使用它：

这将正确编译运行 gulp 捆绑任务，但在浏览器中给出错误 /// ///

浏览器错误：

我找到了 npm 模块 google-maps-api 并安装了它（npm install google-maps-api），但我不知道如何用 systemjs/jspm 导入它（jspm 找不到这个模块）。这是我的 config.js 中的配置：

所以，当我尝试做这样的事情时：

我在浏览器控制台中收到以下错误：

获取https://localhost:44308/app/dist/google-maps-api.js 404（未找到）

查看文件系统，我看到 npm 在 app/node_modules/google-maps-api 下安装了模块，那么如何在 Aurelia 模块的 import 子句中引用它？

我有一些需要使用 System.set(moduleName, Module) 手动添加到注册表的全局类（具有原型语法的 JS 类）。由于第二个参数是模块类型，我需要使用 System.newModule(object)。

但是，如果我将一个非对象传递给 System.newModule()，它会抛出 - Uncaught TypeError: Expected object。

我做错了吗？还有另一种方法可以做到这一点吗？

我目前正在尝试清理一些代码，以便针对接口而不是针对实现进行编程，但不知道如何去做。

更具体地说，我正在使用： * TypeScript 1.5.0 beta -> 转换为 ES5 / commonjs * SystemJS 来加载模块

我目前尝试使用如下外部模块：

post.service.ts 文件：

并且该模块被导入到posts.ts中：

上面的代码编译正确，但基本上我的问题归结为 Angular 不会在 Posts 组件中注入 PostsServiceImpl 的实例。

当然这只是因为我没有找到正确的方法来声明/导出/导入所有内容

如果没有export interface PostsService ...，我会收到 TS 编译错误，因为我在帖子控制器中使用它。

没有export var PostsService:PostsServiceImpl;我在 @View 装饰器的 viewInjector 中得到 TS 编译错误

在生成的 js 代码中，我只找到exports.PostsService;由于导出变量而添加的...我知道接口在运行时会消失。

所以我对这一切有点迷茫。任何实用的想法如何使用 TypeScript 和 Angular 2 的基于接口的编程？

在SystemJS + JSPM托管项目中，如何使用Polymer的元素？

我以前jspm install github:Polymer/polymer安装过Polymer，也jspm install github:PolymerElements/iron-elements安装过iron-elements。

这似乎有多个问题：

第一个，例如在 iron-elements.html 文件中，导入将进入错误的路径：<link rel="import" href="../polymer/polymer.html">而Polymer目录实际上是以其版本命名的（与JSPM一样），所以实际的导入应该<link rel="import" href="../polymer@1.0.5/polymer.html">在我的案子。

其次，在导入Polymer文件时，在SystemJS环境中将其放在 index.html中似乎有点生硬，包括版本路径：

有没有更好的方法在SystemJS中导入这些 html ？

第三，由于Polymer的下载选项是通过使用类似“购物车”的选项或在Bower中手动下载，如果我尝试通过 JSPM 的存储库或获取铁元素或纸元素，它不会下载它们的依赖项，甚至如果我手动添加依赖项，由于JSPM的版本命名，它们的路径仍然是错误的。github:bower:import

根据JSPM的google 小组中的讨论，这个问题

是聚合物假设鲍尔

哪种迫使我放弃我真的不想做的SystemJS或Polymer 。

然而，在（关于Aurelia框架的）不同的讨论中，Rob Eisenberg 提到了将 Polymer 与Aurelia一起使用的可能性：

您应该能够使用 Polymer 的 Paper 元素。为此，您需要在 Aurelia 之前的页面中包含 Polymer 框架。

据我所知，Aurelia正在使用JSPM，可以做到吗？

一个可能的解决方案是切换到RequireJS，然后我可以使用Bower添加Polymer的东西，但我真的很想使用SystemJS，我不确定它是否适用于Aurelia。此外，我可以继续使用SystemJS和JSPM，也可以将Bower用于Polymer的东西。

更新

在找到更好的答案之前，临时解决方案是同时使用JSPM和Bower，其中Bower仅用于Polymer。