无法解析'ngx-bootstrap / component-loader / component-loader.factory'

Question

当我用Angular 7.2.9尝试ng build --prod时，我收到了这个错误

Module not found: Error: Can't resolve 'ngx-bootstrap/dropdown/bs-dropdown.config' in 'C:\Users\fvale\myproject\src\app'
ERROR in ./src/app/app.module.ngfactory.js
Module not found: Error: Can't resolve 'ngx-bootstrap/dropdown/bs-dropdown.module' in 'C:\Users\fvale\myproject\src\app'
ERROR in ./src/app/app.module.ngfactory.js
Module not found: Error: Can't resolve 'ngx-bootstrap/dropdown/bs-dropdown.state' in 'C:\Users\fvale\myproject\src\app'
ERROR in ./src/app/app.module.ngfactory.js
Module not found: Error: Can't resolve 'ngx-bootstrap/positioning/positioning.service' in 'C:\Users\fvale\myproject\src\app'

在从Angular 6.x升级到Angular 7.x之前，我没有此错误

但！奇怪的是我在我的项目中甚至没有使用ngx-bootstrap，而且我的package.json中没有它。我安装它来检查是否能解决问题，但它没有做任何事情。

使用：

ngx-bootstrap：3.2.0

Angular：7.2.9

Bootstrap：4.1.3

和Angular CLI

的package.json

{
  "name": "myproject",
  "version": "0.1.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "prestart": "node version.js",
    "prebuild": "node version.js",
    "start": "ng serve --watch",
    "build": "ng build --prod",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@agm/core": "^1.0.0-beta.5",
    "@angular/animations": "^7.2.9",
    "@angular/cdk": "^7.3.4",
    "@angular/common": "7.2.9",
    "@angular/compiler": "7.2.9",
    "@angular/core": "7.2.9",
    "@angular/forms": "7.2.9",
    "@angular/http": "7.2.9",
    "@angular/material": "^7.3.4",
    "@angular/platform-browser": "7.2.9",
    "@angular/platform-browser-dynamic": "7.2.9",
    "@angular/router": "7.2.9",
    "@fortawesome/fontawesome-svg-core": "^1.2.0",
    "@ng-bootstrap/ng-bootstrap": "^4.1.0",
    "@ngx-translate/core": "^11.0.1",
    "@ngx-translate/http-loader": "^4.0.0",
    "@toverux/ngx-sweetalert2": "^4.0.0",
    "bootstrap": "^4.1.3",
    "bootstrap-social": "^5.1.1",
    "core-js": "^2.4.1",
    "flag-icon-css": "^3.3.0",
    "font-awesome": "^4.7.0",
    "hammerjs": "^2.0.8",
    "moment": "^2.22.2",
    "ng2-color-picker": "^1.3.2",
    "ng2-slim-loading-bar": "^4.0.0",
    "ngx-bootstrap": "^3.2.0",
    "ngx-color": "^2.0.6",
    "ngx-embed-video": "^1.0.4",
    "ngx-moment": "^3.1.0",
    "ngx-slimscroll": "^7.1.0",
    "rxjs": "^6.4.0",
    "rxjs-compat": "^6.2.0",
    "simple-line-icons": "^2.4.1",
    "sweetalert2": "^8.3.0",
    "zone.js": "^0.8.29"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.13.5",
    "@angular/cli": "7.3.5",
    "@angular/compiler-cli": "7.2.9",
    "@angular/language-service": "7.2.9",
    "@types/jasmine": "~3.3.9",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "~11.11.3",
    "codelyzer": "^5.0.0-beta.0",
    "fs-extra": "^7.0.0",
    "git-describe": "^4.0.3",
    "jasmine-core": "~3.3.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "^4.0.1",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "^2.0.5",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "^5.4.0",
    "ts-node": "~8.0.3",
    "tslint": "^5.9.1",
    "typescript": "3.2.4"
  }
}

Answer 1

我从你的package.json生成了package-lock.json，我发现ng2-color-picker需要ngx-bootstrap，如下所示，

"ng2-color-picker": {
      "version": "1.3.2",
      "resolved": "https://registry.npmjs.org/ng2-color-picker/-/ng2-color-picker-1.3.2.tgz",
      "integrity": "sha1-sdcd4Dhm0MJV9anjQzEd67v3Q+8=",
      "requires": {
        "@angular/common": "~4.0.0",
        "@angular/compiler": "~4.0.0",
        "@angular/core": "~4.0.0",
        "@angular/forms": "~4.0.0",
        "@angular/platform-browser": "~4.0.0",
        "ngx-bootstrap": "~1.6.6", <===here
        "rxjs": "^5.1.0",
        "zone.js": "^0.8.4"
      }