@angular/upgrade/static 404 未找到

Posted 2023-02-19

【中文标题】@angular/upgrade/static 404 未找到

【英文标题】：@angular/upgrade/static 404 not found

【发布时间】：2019-01-20 15:26:09

【问题描述】：

我在 AngularJS 中有应用程序，我正在尝试使混合应用程序能够在 Angular 5 上迁移。但不幸的是我有错误：

GET http://localhost:53538/@angular/upgrade/static 404 (Not Found)

它发生在我在 app.module.ts 文件中添加“UpgradeModule”之后，在 imports 声明中：

import  NgModule       from '@angular/core';
import  BrowserModule  from '@angular/platform-browser';
import  FormsModule     from '@angular/forms';
import  HttpClientModule, HTTP_INTERCEPTORS  from '@angular/common/http';
import  UpgradeModule, downgradeComponent  from '@angular/upgrade/static';
import  AppComponent   from './app.component';
import  StorageSvc  from "./common/factories/storageSvc";


@NgModule(
    imports: [
        BrowserModule,
        FormsModule,
        HttpClientModule,
        UpgradeModule
    ],
    declarations: [
        AppComponent
    ],
    providers: [
        StorageSvc
    ],
    bootstrap: [AppComponent]
)

导出类 AppModule

我的 package.json 看起来像这样：

  "name": "test angular hybrid application",
  "version": "1.0.0",
  "scripts": 
    "start": "tsc && concurrently \"npm run tsc:w\" \"npm run lite\" ",
    "lite": "lite-server",
    "tsc": "tsc",
    "tsc:w": "tsc -w"
  ,
  "license": "MIT",
  "dependencies": 
    "@angular/common": "^5.2.0",
    "@angular/compiler": "^5.2.0",
    "@angular/core": "^5.2.0",
    "@angular/forms": "^5.2.0",
    "@angular/platform-browser": "^5.2.0",
    "@angular/platform-browser-dynamic": "^5.2.0",
    "@angular/router": "^5.2.0",
    "@angular/upgrade": "^5.2.11",
    "core-js": "^2.4.1",
    "rxjs": "^5.2.0",
    "systemjs": "^0.20.19",
    "zone.js": "^0.8.5"
  ,
  "devDependencies": 
    "@types/jquery": "^3.3.5",
    "@types/node": "^8.10.23",
    "concurrently": "^3.1.0",
    "lite-server": "^2.3.0",
    "typescript": "^2.9.2"
  

我执行的步骤：转到 package.json 文件夹，运行“npm install”，Insight node_modules/@angular/upgrade 文件夹已安装。但是当我运行应用程序时出现错误：

如果我评论 UpdateModule 洞察导入，app.module.ts 文件，该错误就会消失

imports: [
    BrowserModule,
    FormsModule,
    HttpClientModule//,
   // UpgradeModule
],

能否请任何人提供任何建议，我可以做些什么才能成功地将“UpgradeModule”导入到我的 app.modules.ts 文件中，以便能够使我当前的 AngularJS 应用程序混合并使用 Angular 5 洞察力？

如果您需要更多描述或代码示例，请告诉我

【参考方案1】：

解决方案，也许对某人有帮助： 作为加载程序，我正在使用 System.js，所以为了能够在我的应用程序中使用 UpgradeModule，我需要添加 '@angular/upgrade/static': 'npm:@angular/upgrade/bundles/upgrade-static.umd.js ' 在我的 systemjs.config.js 中使文件看起来像这样：

(function (global) 
    System.config(
        paths: 
            // paths serve as alias
            'npm:': 'node_modules/'
        ,
        // map tells the System loader where to look for things
        map: 
            // our app is within the app folder
            app: 'app',

            // angular bundles
            '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
            '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
            '@angular/common/http': 'npm:@angular/common/bundles/common-http.umd.js',
            '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.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/forms': 'npm:@angular/forms/bundles/forms.umd.js',
            '@angular/upgrade/static': 'npm:@angular/upgrade/bundles/upgrade-static.umd.js',

            // other libraries
            'rxjs': 'npm:rxjs',
            'tslib': 'npm:tslib/tslib.js'
        ,
        // packages tells the System loader how to load when no filename and/or no extension
        packages: 
            app: 
                main: './main.js',
                defaultExtension: 'js'
            ,
            rxjs: 
                defaultExtension: 'js'
            
        
    );
)(this);

添加后我解决了我的问题@angular/upgrade/static 404 (Not Found)