typescript 既然非 beta Angular 2 被打包为@angular,angular2-polyfills 在哪里?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/37034664/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 03:27:49  来源:igfitidea点击:

Where is angular2-polyfills now that non-beta Angular 2 is packaged as @angular?

angulartypescript

提问by Michael Oryl

Now that Angular2 is out of beta (2.0.0-RC.0 and RC.1 came out yesterday/May 3, 2016), all of Angular 2 is packaged for use with NPM under the new @angular namespace. A lot of packages have been moved and must be individually installed now, as you can see in the Angular2 CHANGELOG.

现在 Angular2 已经过测试版(2.0.0-RC.0 和 RC.1 于昨天/2016 年 5 月 3 日发布),所有 Angular 2 都打包在新的 @angular 命名空间下与 NPM 一起使用。正如您在Angular2 CHANGELOG 中看到的那样,许多软件包已被移动,现在必须单独安装。

But one thing that the CHANGELOG doesn't address is how to find the angular2-polyfillsbundle that was available previously.

但是 CHANGELOG 没有解决的一件事是如何找到angular2-polyfills以前可用的包。

My beta code called this in one of its TypeScript files:

我的测试版代码在它的一个 TypeScript 文件中调用了这个:

import 'angular2/bundles/angular2-polyfills';

What do I need to do now to get that same functionality with the new package layout?

我现在需要做什么才能使用新的包布局获得相同的功能?

Here is the ventdor.tsfile that used to import the polyfills so that it could be included by webpack:

这是ventdor.ts用于导入 polyfills的文件,以便它可以被 webpack 包含:

require('./css/bootstrap.css');
require('./css/main.css');

import 'angular2/bundles/angular2-polyfills'; // THIS NO LONGER WORKS

require('./lib/bootstrap/bootstrap.js');

The lack of the polyfills causes errors like the following when I build my application with webpack:

当我使用 webpack 构建我的应用程序时,缺少 polyfill 会导致如下错误:

ERROR in /Users/mfo/Projects/PennMutual/angular2-oauth2/node_modules/@angular/core/src/facade/async.d.ts
(28,45): error TS2304: Cannot find name 'Promise'.

ERROR in /Users/mfo/Projects/PennMutual/angular2-oauth2/node_modules/@angular/core/src/facade/lang.d.ts
(4,17): error TS2304: Cannot find name 'Map'.

ERROR in /Users/mfo/Projects/PennMutual/angular2-oauth2/node_modules/@angular/core/src/facade/lang.d.ts
(5,17): error TS2304: Cannot find name 'Set'.

采纳答案by Michael Oryl

As Thierry Templier said in his answer, the issue is that zone.jsand reflect-metadatahave to be brought in now that the angular2-polyfills.jsbundle is no longer available.

正如亨利TEMPLIER他回答说,这个问题是zone.jsreflect-metadata在现在的被带angular2-polyfills.js束不再可用。

To get the functionality back, you need to import them directly instead of relying on the old polyfills code.

要恢复功能,您需要直接导入它们,而不是依赖旧的 polyfills 代码。

//import 'angular2/bundles/angular2-polyfills'; // no longer available
import 'reflect-metadata';
require('zone.js/dist/zone');
require('zone.js/dist/long-stack-trace-zone'); // for development only - not needed for prod deployment

The reflect-metadatapackage already has built-in typings for TypeScript, so you can use import. Zone.js does not, however, so you need to rely on require()to get webpack to pick it up and include it in your bundles.

reflect-metadata包已经为 TypeScript 提供了内置类型,因此您可以使用import. 但是,Zone.js 没有,因此您需要依靠require()webpack 来获取它并将其包含在您的包中。

Of course you also need to have reflect and zone in your package.jsondependencies section (mine are listed at the end, below):

当然,您还需要在package.json依赖项部分中包含反射和区域(我的列在最后,如下所示):

{
  "name": "angular2-bootstrap4-oauth2-ohmy",
  "version": "1.0.8",
  "description": "A skeleton Angular2, Bootstrap 4, OAuth2 application using webpack (oh my!)",
  "repository": "https://github.com/michaeloryl/angular2-bootstrap4-oauth2-webpack.git",
  "dependencies": {
    "@angular/common": "^2.0.0-rc.1",
    "@angular/compiler": "^2.0.0-rc.1",
    "@angular/core": "^2.0.0-rc.1",
    "@angular/http": "^2.0.0-rc.1",
    "@angular/platform-browser": "^2.0.0-rc.1",
    "@angular/platform-browser-dynamic": "^2.0.0-rc.1",
    "@angular/router": "^2.0.0-rc.1",
    "@angular/router-deprecated": "^2.0.0-rc.1",
    "bootstrap": "4.0.0-alpha.2",
    "es6-promise": "^3.0.2",
    "es6-shim": "^0.35.0",
    "jquery": "^2.1.4",
    "js-cookie": "^2.1.0",
    "lodash": "^4.11.2",
    "phantomjs-prebuilt": "^2.1.7",
    "require": "^2.4.20",
    "rxjs": "^5.0.0-beta.6",
    "traceur": "0.0.93",
    "reflect-metadata": "^0.1.2",
    "zone.js": "^0.6.12"
  },
}

Once that is done, you should have a working application again (assuming you took care of the other issues involved in moving from Angular2 beta to the RC (release candidate) code.

完成后,您应该再次拥有一个可以工作的应用程序(假设您处理了从 Angular2 beta 迁移到 RC(候选发布)代码所涉及的其他问题。

This code is a sample from my angular2-bootstrap4-oauth2-webpackproject on Github.

这段代码是我在 Github 上的angular2-bootstrap4-oauth2-webpack项目中的一个示例。

回答by Thierry Templier

There is no more angular2-polyfills.jsfile. You need to include explicitly ZoneJS and Reflect Metadata libraries (FYI angular2-polyfill contained these two libraries) So you need to include the following:

没有更多angular2-polyfills.js文件了。您需要明确包含 ZoneJS 和 Reflect Metadata 库(仅供参考 angular2-polyfill 包含这两个库)因此您需要包含以下内容:

<script src="node_modules/zone.js/dist/zone.js"></script>
<script src="node_modules/reflect-metadata/Reflect.js"></script>

回答by kmk09k

I recently had this issue with rc.5 and solved it by importing zone like so:

我最近在 rc.5 中遇到了这个问题,并通过像这样导入 zone 来解决它:

// import 'angular2/bundles/angular2-polyfills'; // old
import 'reflect-metadata';
import 'zone.js/dist/zone'; 
import 'zone.js/dist/long-stack-trace-zone';