Question

我使用Angular2启动器和webpackjs AMD。我根本没有收到任何构建错误，但是当我浏览（使用npm服务器）时，我收到一些错误：

我在构建配置中遗漏了什么？我需要检查什么才能使其正常工作？

提前感谢。

///错误一

long-stack-trace-zone.js：106未捕获的ReferenceError：未定义区域（匿名函数）@ long-stack-trace-zone.js：106（匿名函数）@long-stack-trace-zone。 js：165__webpack_require__ @ long-stack-trace-zone.js：20NEWLINE @long-stack-trace-zone.js：40232 @ long-stack-trace-zone.js：43__webpack_require__ @ bootstrap e8f2c957aba446c2eaa1：500 @ vendor.ts:4__webpack_require__ @ bootstrap e8f2c957aba446c2eaa1：500 @ bootstrap e8f2c957aba446c2eaa1：93（匿名函数）@ bootstrap e8f2c957aba446c2eaa1：93 decorators.js：164使用类decoratorscheckReflect @ decorators.js时需要uncaught reflect-metadata shim：164（匿名函数）@ decorators.js：166__webpack_require__ @ bootstrap e8f2c957aba446c2eaa1：50（匿名函数）@ decorators.js：2__webpack_require__ @ bootstrap e8f2c957aba446c2eaa1 ：50（匿名函数）@ di.js：18__webpack_require__ @ bootstrap e8f2c957aba446c2eaa1：50（匿名函数）@ browser_common.js：2__webpack_require__ @ bootstrap e8f2c957aba446c2eaa1：50（匿名函数）@ browser.js：3__webpack_require__ @ bootstrap e8f2c957aba446c2eaa1：50（匿名函数）@ boot.ts：2__webpack_require__ @ bootstrap e8f2c957aba446c2eaa1：50webpackJsonpCallback @ bootstrap e8f2c957aba446c2eaa1：21（匿名函数）@ app.bundle.js：1

//错误二

class decoratorscheckReflect @ decorators.js：164（匿名函数）@ decorators.js：166__webpack_require__ @ bootstrap e8f2c957aba446c2eaa1：50（匿名函数）@ decorators.js：2__webpack_require__ @ bootstrap e8f2c957aba446c2eaa1：50（匿名函数）@ di.js： 18__webpack_require__ @自举e8f2c957aba446c2eaa1：50（匿名功能）@ browser_common.js：2__webpack_require__ @引导e8f2c957aba446c2eaa1：50（匿名功能）@ browser.js：3__webpack_require__ @引导e8f2c957aba446c2eaa1：50（匿名功能）@ boot.ts：2__webpack_require__ @引导e8f2c957aba446c2eaa1： 50webpackJsonpCallback @ bootstrap e8f2c957aba446c2eaa1：21（匿名函数）@ app.bundle.js：1

//的package.json

    {
      "name": "angular2",
      "version": "1.0.0",
      "description": "Angular 2",
       "scripts": {
        "build": "webpack",
        "start": "webpack-dev-server"
       },
    "license": "ISC",
     "devDependencies": {
      "ts-loader": "^0.7.2",
      "tsd": "^0.6.5",
      "typescript": "^1.7.5",
      "webpack": "^1.12.11",
      "webpack-dev-server": "^1.14.1"
  },
  "dependencies": {
    "angular2": "^2.0.0-beta.11",
    "es6-promise": "^3.0.2",
    "es6-shim": "^0.33.13",
    "reflect-metadata": "^0.1.2",
    "rxjs": "^5.0.0-beta.0",
    "zone.js": "^0.6.5"
  }
}

// ts.config

{
  "compilerOptions": {
    "target": "ES5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false
  },
  "exclude": [
    "node_modules"
  ],
  "filesGlob": [
    "typings/**/*.ts",
    "app/**/*.ts"
  ],
  "files": [
    "typings/angular2/angular2.d.ts",
    "typings/tsd.d.ts",
    "app/app.component.ts",
    "app/boot.ts",
    "app/vendor.ts"
  ],

  "compileOnSave": false,
  "buildOnSave": false,
  "atom": {
    "rewriteTsconfig": true
  }
}

// vendor.ts

// Polyfills

import 'es6-shim';
import 'es6-promise';
import 'zone.js/dist/long-stack-trace-zone';
import 'reflect-metadata';

Answer 1

您需要将zone本身添加到您的polyfill中。您也可以删除es6-promise，因为es6-shim包含该{。}}。

import 'es6-shim';
import 'zone.js/dist/zone'; // You are missing this one
import 'zone.js/dist/long-stack-trace-zone';
import 'reflect-metadata';

确保更新到beta.12和zone.js 0.6.6，因为这两个修复了以前版本中与区域相关的一些错误。

Angular2 - long-stack-trace-zone.js：106未捕获的ReferenceError：未定义区域

1 个答案: