gpt4 book ai didi

javascript - 如何使用 Angular 2(测试版和更新版本)加载 RxJS(和 zone.js/reflect-metadata)?

转载 作者:可可西里 更新时间:2023-11-01 02:21:27 26 4
gpt4 key购买 nike

从 Angular 2 Alpha 54(changelog)开始,RxJS 不再包含在 Angular 2 中。

更新:原来 zone.jsreflect-metadata 也被排除在外。

因此,我现在收到以下错误(如 Chrome 开发控制台中所示):

system.src.js:4681 GET http://localhost:3000/rxjs/Subject 404 (Not Found)F @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681
system.src.js:4681 GET http://localhost:3000/rxjs/observable/fromPromise 404 (Not Found)F @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681
localhost/:1 Uncaught (in promise) Error: XHR error (404 Not Found) loading http://localhost:3000/rxjs/Subject(…)t @ system.src.js:4681g @ system.src.js:4681(anonymous function) @ system.src.js:4681
system.src.js:4681 GET http://localhost:3000/rxjs/operator/toPromise 404 (Not Found)F @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681(anonymous function) @ system.src.js:4681
system.src.js:4681 GET http://localhost:3000/rxjs/Observable 404 (Not Found)

我的 package.json 文件 (^5.0.0-beta.0) 中有 RxJS,它已通过 npm 安装,但问题是我只是目前对 SystemJS 还不够熟悉,无法运行。这是我的 index.html 文件的正文部分:

<body>
<app></app> <!-- my main Angular2 tag, which is defined in app/app as referenced below -->

<script src="../node_modules/systemjs/dist/system.js"></script>
<script src="../node_modules/typescript/lib/typescript.js"></script>
<script src="../node_modules/angular2/bundles/angular2.dev.js"></script>
<script src="../node_modules/angular2/bundles/http.dev.js"></script>
<script>
System.config({
packages: {'app': {defaultExtension: 'js'}}
});
System.import('./app/app');
</script>

<script src="http://localhost:35729/livereload.js"></script>
</body>

我一直在尝试其他配置,但没有一个让我一路走到那一步。我的猜测是这相对简单,只是我缺乏理解或工具的使用方式阻碍了我。

这是我的 app.ts 文件,它是 SystemJS 配置中引用的 app/app:

import {Component} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';
import {COMMON_DIRECTIVES} from 'angular2/common';

@Component({
selector: 'app',
directives: [],
template: `<div>{{greeting}}, world!</div>`
})
export class App {
greeting:string = 'Hello';
}

bootstrap(App, [COMMON_DIRECTIVES]);

我正在使用使用静态映射的 livereload Express 服务器为应用程序提供服务,以便像 http://localhost:3000/node_modules/rxjs/Rx.js 即使 index.html 作为服务器的根目录从 /src 提供并且 node_modules 实际上位于与 src 处于同一级别,但不在其中。

一如既往,我们将不胜感激。

最佳答案

事实证明,通过将我的 index.html 文件中的 SystemJS 配置更改为以下内容,问题很容易解决:

System.config({
map: {
rxjs: 'node_modules/rxjs' // added this map section
},
packages: {
'app': {defaultExtension: 'js'},
'rxjs': {defaultExtension: 'js'} // and added this to packages
}
});
System.import('app/app');

我实际上已经尝试过了,但我没有意识到 zone.jsreflect-metadata 也不再包含在 Angular 2 中,我当时也遇到了这个问题。

对于那些感兴趣的人,我通过包含 angular2-polyfills.js 最容易地解决了缺少 zone.jsreflect-metadata 的问题> 我的 index.html 中的文件:

<script src="../node_modules/angular2/bundles/angular2-polyfills.js"></script>

现在我的应用可以像在 Alpha 53 上一样运行。

关于javascript - 如何使用 Angular 2(测试版和更新版本)加载 RxJS(和 zone.js/reflect-metadata)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34318885/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com