使用webpack最简单的angular2设置

Question

I'm working through egghead.io tutorials on Angular2, but they are still using the beta. I'm looking at the docs for Angular2 Quickstart which point to the more up-to-date release candidate, but I can't get the webpack server from the egghead.io lesson to work with the angular2 packages and I'm not really sure where the hangup is.

In package.json :

  "devDependencies": {
    "html-webpack-plugin": "^2.9.0",
    "ts-loader": "^0.7.2",
    "typescript": "^1.7.3",
    "typings": "^0.6.8",
    "webpack": "^1.12.14",
    "webpack-dev-server": "^1.14.0"
  },
  "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",
    "@angular/upgrade": "^2.0.0-rc.1",
    "reflect-metadata": "^0.1.3",
    "rxjs": "^5.0.0-beta.8",
    "zone.js": "^0.6.12"
  }

I haven't changed the webpack.config.js from the one presented in the lesson.

When I do npm start (run the webpack server) I keep getting

Error during instantiation of NgZone! (ApplicationRef -> ApplicationRef_ -> NgZone).
Cannot read property 'fork' of undefined

This would indicate to me that zone.fork is not loading. I did update my vendor.ts file to:

import 'zone.js';
import 'reflect-metadata';

but I still get the same error as above. If I include a simple script tag with console.log(zone.fork) it logs a function, so it seems like zone.js is being loaded. I'm not sure why Angular2 won't start or if there is something else I need to include.

Answer 1

You are importing

"rxjs": "^5.0.0-beta.8",

but rc.1 is only compatible with beta.6