模块未找到错误: 错误: 无法解析'./$$_gendir/app/app.module.ngfactory'。

4

就在昨天我的代码运行良好,没有对应用程序模块进行任何更改,在今天使用 "ng build --prod" 时出现了这个错误。我知道这与更改无关,因为当我拉取旧分支时也遇到了相同的错误。我不知道该怎么办,有人建议更新每个软件包,但即使在更新后仍然遇到相同的错误。甚至不确定你们能否帮忙,但这是我的app.module:

import {BrowserModule} from '@angular/platform-browser';
import {NgModule} from '@angular/core';
import {FormsModule} from '@angular/forms';
import {HttpModule} from '@angular/http';

import {AppComponent} from './app.component';
import {LoginComponent} from './login/login.component';
import {CompareComponent} from './compare/compare.component';
import {RouterModule} from "@angular/router";
import {CompareCardComponent} from './compare/compare-card/compare-card.component';
import {LayoutComponent} from './layout/layout.component';
import {CompareValuePipe} from "./compare/compare-card/compare-card.pipe";
import {HomeComponent} from './home/home.component';
import {NewLocationComponent} from './new-location/new-location.component';
import {SignupComponent} from './signup/signup.component';
import {ValidateMe} from "./shared/me.suite/validate.me/validate.me";
import {TagsComponent} from './tags/tags.component';
import {GoogleplaceDirective} from './third-party/angular2-google-map-auto-complete/directives/googleplace.directive';
import { LoaderComponent } from './shared/loader/loader.component';
import { AlertComponent } from './shared/alert/alert.component';
import {Angulartics2GoogleAnalytics, Angulartics2Module} from "angulartics2";
import { OverallPipe } from './compare/overall.pipe';
import {InteractiveComponent} from "./question/interactive/interactive.component";
import { FormComponent } from './question/form/form.component';
import { KpiDescComponent } from './compare/kpi-desc/kpi-desc.component';
import {HashLocationStrategy, Location, LocationStrategy} from "@angular/common";
import {AccountApi} from "./services/account-api.service";
import {SettingsApi} from "./services/settings-api.service";
import {DataApi} from "./services/data-api.service";
import { ZeezorInfoComponent } from './zeezor-info/zeezor-info.component';

const ROUTES = [
    {path: '', redirectTo: '/home', pathMatch: 'full'},
    {path: 'compare', component: CompareComponent},
    {path: 'new', component: NewLocationComponent},
    {path: 'tags', component: TagsComponent},
    {path: 'interactive', component: InteractiveComponent},
    {path: 'form', component: FormComponent},
    {path: 'login', component: LoginComponent},
    {path: 'signup', component: SignupComponent},
    {path: 'home', component: HomeComponent},
    {path: '**', component: HomeComponent}
];

@NgModule({
    declarations: [
        LayoutComponent,
        AppComponent,
        LoginComponent,
        CompareComponent,
        CompareCardComponent,
        CompareValuePipe,
        InteractiveComponent,
        HomeComponent,
        NewLocationComponent,
        SignupComponent,
        ValidateMe,
        TagsComponent,
        GoogleplaceDirective,
        LoaderComponent,
        AlertComponent,
        OverallPipe,
        FormComponent,
        KpiDescComponent,
        ZeezorInfoComponent
    ],
    imports: [
        BrowserModule,
        FormsModule,
        HttpModule,
        RouterModule.forRoot(ROUTES),
        Angulartics2Module.forRoot([ Angulartics2GoogleAnalytics ])
    ],
    providers: [AccountApi, DataApi, SettingsApi, Location, {provide: LocationStrategy, useClass: HashLocationStrategy}],
    bootstrap: [AppComponent]
})
export class AppModule {
    constructor(){
        let style = document.createElement('link');
        style.rel = "stylesheet";
        style.href = SettingsApi.styleEndpoint;
        window.document.head.appendChild(style);
        console.log(navigator.userAgent);
    }
}

Package.json

{
  "name": "stack-up",
  "version": "0.0.0",
  "license": "MIT",
  "angular-cli": {},
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "compile": "ng build --environment=mobile --output-path ../mobile/www/",
    "compile:prod": "ng build --environment=mobile --target=production --output-path ../mobile/www/",
    "docker": "ng build --environment=docker",
    "local": "ng serve --environment=local",
    "dev": "ng build --environment=dev",
    "prod": "ng build --environment=prod --target=production --output-path /var/www/html/"
  },
  "private": true,
  "dependencies": {
    "@angular/common": "^2.4.0",
    "@angular/compiler": "^2.4.0",
    "@angular/core": "^2.4.0",
    "@angular/forms": "^2.4.0",
    "@angular/http": "^2.4.0",
    "@angular/platform-browser": "^2.4.0",
    "@angular/platform-browser-dynamic": "^2.4.0",
    "@angular/router": "^3.4.0",
    "angular2-jwt": "^0.2.2",
    "angular2-social-login": "^2.1.0",
    "angulartics2": "^2.2.1",
    "core-js": "^2.4.1",
    "rxjs": "^5.0.1",
    "ts-helpers": "^1.1.1",
    "tslint": "^3.15.1",
    "zone.js": "^0.7.2"
  },
  "devDependencies": {
    "@angular/cli": "1.0.0-beta.31",
    "@angular/compiler-cli": "^2.4.0",
    "@types/jasmine": "2.5.38",
    "@types/node": "^6.0.42",
    "codelyzer": "~2.0.0-beta.1",
    "jasmine-core": "2.5.2",
    "jasmine-spec-reporter": "2.5.0",
    "karma": "1.2.0",
    "karma-chrome-launcher": "^2.0.0",
    "karma-cli": "^1.0.1",
    "karma-jasmine": "^1.0.2",
    "karma-coverage-istanbul-reporter": "^0.2.0",
    "protractor": "~5.1.0",
    "ts-node": "1.2.1",
    "tslint": "^4.3.0",
    "typescript": "~2.0.0"
  }
}
5个回答

4

昨天我遇到了类似的问题(同样的错误信息),根据这个 Angular CLI 问题,我进行了修复:

https://github.com/angular/angular-cli/issues/7125

修复方法是在我的 package.json 中将 enhanced-resolve 版本锁定为 3.3.0,删除 node_modules,运行 npm install,然后重新构建。这似乎已经为一些人解决了问题。

新版本的 enhanced-resolve 似乎引起了某些问题。

如果仍然出现错误,请确保通过运行 npm ls enhanced-resolve 确定正确的 enhanced-resolve 版本。


恭喜发财!谢谢,我看到了那个帖子,尝试了一下,但没有得到特定的版本或卸载 node_modules。干杯! - Brayan Byrdsong
在一个程序包中,“pin”一词是否代替“add”使用? - Zze
'pin' 的意思是设置特定的版本。对于 package.json 文件来说,这意味着从版本字符串中删除任何波浪线(~)或插入符号(^)字符。在这种情况下,“enhanced-resolve”:“3.3.0” 被添加到 package.json 中,以便使用特定的版本。 - Brian Walker

4

如果有其他人遇到这个问题,这是由于旧版本的angular-cliangular之间存在差异。 来源

要解决此问题,请将angular-cli升级到@latest

npm uninstall -g angular-cli
npm cache clean
npm install -g @angular/cli@latest

Depending on your system, you may need to prefix the above commands with sudo.

Also, most likely you want to also update your local project version, because inside your project directory it will be selected with higher priority than the global one:

rm -rf node_modules
npm uninstall --save-dev angular-cli
npm install --save-dev @angular/cli@latest
npm install

How to upgrade Angular CLI to the latest version


1
我今天遇到了这个问题。我尝试运行命令:ng build --env=prod而不是ng build --prod,似乎解决了问题,而不需要在package.json中添加enhanced-resolve。

这对我来说是解决问题的关键--必须使用node v6和一个旧的依赖集来尝试重建当前版本的某个东西,所以我不得不:
  1. 清除node_modules并让它重新下载所有内容
  2. 使用--env=prod参数构建ng
- Joel Kleier

0

0

在此输入图片描述如前面的答案所提到的,增强解析器版本3.4.1导致了问题。使用版本3.3.0可以解决此问题。我们可以使用nopm-srinkwrap.json来锁定依赖关系的版本。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接