正在升级 Angular 项目

Upgrading Angular Project

我正在将 Angular 项目从 Angular 2 rc4 升级到当前版本,即 2.4.4。我已经在我们的另一个内部项目中完成了此操作,但是我在这样做时遇到了一些奇怪的错误。

我已经升级了所有 angular 包,以及 typescript、zone.js、rxjs 和新的 @types 模块。我的 systemjs.config.js 文件如下所示:

var System;
(function(global) {
    const paths = {
        'deps:': 'js/dependencies/'
    };
    // map tells the System loader where to look for things
    var map = {
        'app':                                  'js/app', // 'dist',
        'rxjs':                                 'deps:rxjs',
        'ng2-bootstrap':                        'js/dependencies/ng2-bootstrap',
        'ng2-file-upload':                      'deps:ng2-file-upload',
        'moment':                               'deps:moment',
        'lodash':                               'deps:lodash',
        'symbol-observable':                    'deps:symbol-observable',
        '@angular/core':                        'deps:@angular/core/bundles/core.umd.js',
        '@angular/common':                      'deps:@angular/common/bundles/common.umd.js',
        '@angular/compiler':                    'deps:@angular/compiler/bundles/compiler.umd.js',
        '@angular/platform-browser':            'deps:@angular/platform-browser/bundles/platform-browser.umd.js',
        '@angular/platform-browser-dynamic':    'deps:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
        '@angular/http':                        'deps:@angular/http/bundles/http.umd.js',
        '@angular/router':                      'deps:@angular/router/bundles/router.umd.js',
        '@angular/forms':                       'deps:@angular/forms/bundles/forms.umd.js',
    };

    // packages tells the System loader how to load when no filename and/or no extension
    var packages = {
        'app':                        { main: 'main.js',  defaultExtension: 'js' },
        'rxjs':                       { defaultExtension: 'js' },
        'moment':                     { main: 'moment.js', defaultExtension: 'js' },
        'lodash':                     { main: 'index.js', defaultExtension: 'js' },
        'ng2-bootstrap':              { format: 'cjs', main: 'bundles/ng2-bootstrap.umd.js', defaultExtension: 'js' },
        'ng2-file-upload':            { main: 'ng2-file-upload.js', defaultExtension: 'js' }
    };

    var config = {
        paths: paths,
        map: map,
        packages: packages
    };

    System.config(config);

})(this);

这与我们拥有的另一个 Angular 项目完全相同(并且在那边工作)。

当我构建项目并加载它时,在浏览器控制台中出现以下错误:

[path]/@angular/router/bundles/router.umd.js/src/url_tree 404 (Not Found)
ZoneAwareError
    Error: Error: XHR error (404 Not Found) loading [path]/@angular/router/bundles/router.umd.js/src/url_tree

我尝试了其他 systemjs.config.js 格式,例如 this one,但我仍然遇到错误。那个略有不同; 404 在 traceur.

我只是不确定错误的来源或修复方法。如果有人对去哪里有任何想法或指示,我将不胜感激!

所以我想出了在这个特殊情况下我的错误是从哪里来的。我不能说这一直是问题所在,但这对我来说是个问题。

我有一个检查当前路线然后隐藏或显示菜单组件的功能。该代码已过时,需要更新,但因为我还没有更新它,所以它失败了,这就是 404 的来源。

违规导入是:

import { containsTree } from '@angular/router/src/url_tree';

我注释掉了,错误消失了。所以现在我也可以继续更新该代码了。