Angular2 升级到 RC6，找不到 traceur

Question

升级到 RC6 后，出现以下错误：

zone.js:101 GET http://localhost/traceur 404 (Not Found)
zone.js:484 Unhandled Promise rejection: Error: XHR error (404 Not Found) loading http://localhost/traceur
            at XMLHttpRequest.wrapFn [as _onreadystatechange] (http://localhost/vendor/zone.js/dist/zone.js:794:30)
            at ZoneDelegate.invokeTask (http://localhost/vendor/zone.js/dist/zone.js:365:38)
            at Zone.runTask (http://localhost/vendor/zone.js/dist/zone.js:265:48)
            at XMLHttpRequest.ZoneTask.invoke (http://localhost/vendor/zone.js/dist/zone.js:433:34)
        Error loading http://localhost/traceur
        Error loading http://localhost/vendor/@angular/platform-browser-dynamic/index.js as "@angular/platform-browser-dynamic" from http://localhost/main.js ; Zone: <root> ; Task: Promise.then ; Value: Error: Error: XHR error (404 Not Found) loading http://localhost/traceur(…) null
zone.js:486 Error: Uncaught (in promise): Error: Error: XHR error (404 Not Found) loading http://localhost/traceur(…)
system.src.js:371 Assertion failed: loading or loaded

我知道没有代码很难解决问题，但也许有人有同样的错误并想通了。

现有帖子无法解决我的问题

更新： system.config.js:

// SystemJS configuration file, see links for more information
// https://github.com/systemjs/systemjs
// https://github.com/systemjs/systemjs/blob/master/docs/config-api.md

/***********************************************************************************************
 * User Configuration.
 **********************************************************************************************/
/** Map relative paths to URLs. */
const map: any = {
  "ng2-charts": "vendor/ng2-charts",
  'ng2-bs3-modal': 'vendor/ng2-bs3-modal',
  'angular2-moment': 'vendor/angular2-moment',
  "assets": "assets",
};

/** User packages configuration. */
const packages: any = {
  "ng2-charts": {main: 'ng2-charts.js'},
  "ng2-bs3-modal": {main: 'ng2-bs3-modal.js'},
  "angular2-moment": {main: 'index.js'}
};

////////////////////////////////////////////////////////////////////////////////////////////////
/***********************************************************************************************
 * Everything underneath this line is managed by the CLI.
 **********************************************************************************************/
const barrels: string[] = [
  // Angular specific barrels.
  '@angular/core',
  '@angular/common',
  '@angular/compiler',
  '@angular/forms',
  '@angular/http',
  '@angular/router',
  '@angular/platform-browser',
  '@angular/platform-browser-dynamic',

  // Thirdparty barrels.
  'rxjs',

  // App specific barrels.
  'app',
  'app/shared',
  'app/shared/navbar',
  'app/shared/sidebar',
  'app/shared/footer',
  'app/dashboard',
  'app/docs',
  /** @cli-barrel */
];

const cliSystemConfigPackages: any = {};
barrels.forEach((barrelName: string) => {
  cliSystemConfigPackages[barrelName] = { main: 'index' };
});

/** Type declaration for ambient System. */
declare var System: any;

// Apply the CLI SystemJS configuration.
System.config({
  map: {
    '@angular': 'vendor/@angular',
    'rxjs': 'vendor/rxjs',
    'main': 'main.js',
  },
  packages: cliSystemConfigPackages
});

// Apply the user's configuration.
System.config({ map, packages });

更新 2： 我将 system.config.js 更改为以下内容：

// SystemJS configuration file, see links for more information
// https://github.com/systemjs/systemjs
// https://github.com/systemjs/systemjs/blob/master/docs/config-api.md

/***********************************************************************************************
 * User Configuration.
 **********************************************************************************************/
/** Map relative paths to URLs. */
const map: any = {
  "ng2-charts": "vendor/ng2-charts",
  'ng2-bs3-modal': 'vendor/ng2-bs3-modal',
  'angular2-moment': 'vendor/angular2-moment',
  "assets": "assets",
};

/** User packages configuration. */
const packages: any = {
  "ng2-charts": {main: 'ng2-charts.js'},
  "ng2-bs3-modal": {main: 'ng2-bs3-modal.js'},
  "angular2-moment": {main: 'index.js'}
};

////////////////////////////////////////////////////////////////////////////////////////////////
/***********************************************************************************************
 * Everything underneath this line is managed by the CLI.
 **********************************************************************************************/
const barrels: string[] = [
  // App specific barrels.
  'app',
  'app/shared',
  'app/shared/navbar',
  'app/shared/sidebar',
  'app/shared/footer',
  'app/dashboard',
  'app/docs',
  /** @cli-barrel */
];

const cliSystemConfigPackages: any = {};
barrels.forEach((barrelName: string) => {
  cliSystemConfigPackages[barrelName] = { main: 'index' };
});

/** Type declaration for ambient System. */
declare var System: any;

// Apply the CLI SystemJS configuration.
System.config({
  map: {
    'main': 'main.js',
  },
  packages: cliSystemConfigPackages
});

// Apply the user's configuration.
System.config({ map, packages });

System.config({
  //use typescript for simple compilation (no typechecking)
  //transpiler: 'typescript',
  //typescript compiler options
  //typescriptOptions: {
  //emitDecoratorMetadata: true
  //},
  paths: {
    'npm:': 'vendor/'
  },
  map: {
    'app': './src',

    '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
    '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
    '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
    '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
    '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
    '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
    '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
    '@angular/router': 'npm:@angular/router/bundles/router.umd.js',


    '@angular/core/testing': 'npm:@angular/core/bundles/core-testing.umd.js',
    '@angular/common/testing': 'npm:@angular/common/bundles/common-testing.umd.js',
    '@angular/compiler/testing': 'npm:@angular/compiler/bundles/compiler-testing.umd.js',
    '@angular/http/testing': 'npm:@angular/http/bundles/http-testing.umd.js',
    '@angular/platform-browser/testing': 'npm:@angular/platform-browser/bundles/platform-browser-testing.umd.js',
    '@angular/platform-browser-dynamic/testing': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic-testing.umd.js',
    '@angular/router/testing': 'npm:@angular/router/bundles/router-testing.umd.js',

    'rxjs': 'npm:rxjs'
  },
  //packages defines our app package
  packages: {
    app: {
      main: './main.ts',
      defaultExtension: 'ts'
    },
    rxjs: {
      defaultExtension: 'js'
    }
  }
});

现在我收到以下错误：

zone.js:101 GET http://localhost/vendor/@angular/common/bundles/common.umd.js/src/directives/core_directives 404 (Not Found)

Answer 1

下午好，我整天都有同样的问题。在查阅了几个不同的链接之后，我终于通过将 system.config.ts 更改为以下内容来启动并工作：

"use strict";
// SystemJS configuration file, see links for more information
// https://github.com/systemjs/systemjs
// https://github.com/systemjs/systemjs/blob/master/docs/config-api.md
/***********************************************************************************************
 * User Configuration.
 **********************************************************************************************/
/** Map relative paths to URLs. */
const map: any = {
    "@angular": "vendor/@angular",
    "rxjs": "vendor/rxjs",
    "typescript": "node_modules/typescript/lib/typescript.js",
    "materialize": "vendor/materialize-css",
    "angular2-materialize": "vendor/angular2-materialize",
    "jquery": "vendor/jquery"
};
/** User packages configuration. */
const packages: any = {
    "materialize": {
        "format": "global",
        "main": "dist/js/materialize",
        "defaultExtension": "js"
    },
    "angular2-materialize": {
        "main": "dist/index",
        "defaultExtension": "js"
    },
    "@angular/core": {
        main: "bundles/core.umd.js" //use the ESM entry point for bundling tools
    },
    "@angular/common": {
        main: "bundles/common.umd.js" //use the ESM entry point for bundling tools
    },
    "@angular/compiler": {
        main: "bundles/compiler.umd.js" //use the ESM entry point for bundling tools
    },
    "@angular/forms": {
        main: "bundles/forms.umd.js"
    },
    "@angular/http": {
        main: "bundles/http.umd.js"
    },
    "@angular/platform-browser": {
        main: "bundles/platform-browser.umd.js" //use the ESM entry point for bundling tools
    },
    "@angular/platform-browser-dynamic": {
        main: "bundles/platform-browser-dynamic.umd.js" //use the ESM entry point for bundling tools
    },
    "@angular/router": {
        main: "bundles/router.umd.js" //use the ESM entry point for bundling tools
    },
};
////////////////////////////////////////////////////////////////////////////////////////////////
/***********************************************************************************************
 * Everything underneath this line is managed by the CLI.
 **********************************************************************************************/
const barrels: string[] = [
    // Angular specific barrels.
    "@angular/core",
    "@angular/common",
    "@angular/compiler",
    "@angular/forms",
    "@angular/http",
    "@angular/router",
    "@angular/platform-browser",
    "@angular/platform-browser-dynamic",

    // Thirdparty barrels.
    "rxjs",

    // App specific barrels.
    "app"
    /** @cli-barrel */
];
const cliSystemConfigPackages: any = {};
barrels.forEach((barrelName: string) => {
    cliSystemConfigPackages[barrelName] = { main: "index" };
});

/** Type declaration for ambient System. */
declare var System: any;

// Apply the CLI SystemJS configuration.
System.config({
    map: {
        "@angular": "vendor/@angular",
        "rxjs": "vendor/rxjs",
        "jquery": "node-modules/jquery",
        "materialize-css": "node-modules/materialize-css",
        "angular2-materialize": "node_modules/angular2-materialize",
        "main": "main.js"
    },
    packages: cliSystemConfigPackages
});
// Apply the user"s configuration.
System.config({ map, packages });

Answer 2

维多利亚，

感谢分享您的作品systems.config。我用它来与我的进行比较，我只需要删除以下行并修复它：

// 路由器还没有umd
packages['@angular/router'] = { main: 'index.js', defaultExtension: 'js' };

此行随Angular RC5 快速入门教程一起提供。

再次，

非常感谢分享。我为此苦苦挣扎了一天。 :-)

干杯！

Answer 3

我不确定你是否解决了这个问题。但是，我运行完成了对我有用的修复。实际上，它是一种解决方法，因此它的解决方案要少一些。

https://github.com/angular/angular/issues/10881

显然 Angular 在解析 NgModule 文件时存在一些愚蠢的多行注释问题。迁移时，我将旧的 main.ts 复制到 /* */ 中以供参考。把这些线去掉，运行完美。

Answer 4

在此 link 中可以找到查看应用更改的简单方法： https://reviews.angular.io/R4:4f2bc6690486610c5736ce67ead984ba7ff1ce8d

Angular2 升级到 RC6，找不到 traceur

Angular2 upgrade to RC6, traceur not found

angular2-upgrade

angular