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

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

我的测试版代码在其中一个TypeScript文件中称之为:

import 'angular2/bundles/angular2-polyfills';

我现在需要做什么才能在新的软件包布局中获得同样的功能?

以下是用于导入polyfills的ventdor.ts个文件,以便将其包含在网页包中:

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

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

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

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

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'.

推荐答案

正如蒂埃里·坦普尔在他的回答中所说,问题是既然angular2-polyfills.jsBundle 包不再可用,就必须引入zone.jsreflect-metadata.

要恢复功能,需要直接导入它们,而不是依赖旧的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

reflect-metadata包已经内置了TypeScript的打字功能,所以可以使用import.区然而,js并没有,所以你需要依靠require()来获取webpack,并将其包含在你的包中.

当然,你还需要在你的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"
  },
}

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

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

Typescript相关问答推荐

对于使用另一个对象键和值类型的对象使用TS Generics

使用带有RxJS主题的服务在Angular中的组件之间传递数据

在包含泛型的类型脚本中引用递归类型A<;-&B

用于验证字符串变量的接口成员

有没有可能产生输出T,它在视觉上省略了T中的一些键?

正交摄影机正在将渲染的场景切成两半

有没有办法防止类型交集绕过联合类型限制?

RXJS将对键盘/鼠标点击组合做出react

tailwind css未被应用-react

TS2739将接口类型变量赋值给具体变量

如何在不违反挂钩规则的情况下动态更改显示内容(带有状态)?

使用Type脚本更新对象属性

如何为带有参数的函数类型指定类型保护?

如何从抽象类的静态方法创建子类的实例?

替换typescript错误;X类型的表达式可以';t用于索引类型Y;带有未定义

如何使用 Angular 确定给定值是否与应用程序中特定单选按钮的值匹配?

基于参数的 TS 返回类型

如何为字符串模板文字创建类型保护

const 使用条件类型时,通用类型参数不会推断为 const

使用 Next.js 路由重定向到原始 URL 不起作用