无法找到模块"@angular-devkit/build-angular&quot。

更新到Angular 6.0.1后，我在ng serve上得到了以下错误。

Could not find module "@angular-devkit/build-angular" from "/home/Projects/myProjectName".
Error: Could not find module "@angular-devkit/build-angular" from "/home/Projects/myProjectName".
    at Object.resolve (/home/Projects/myProjectName/node_modules/@angular-devkit/core/node/resolve.js:141:11)
    at Observable.rxjs_1.Observable [as _subscribe] (/home/Projects/myProjectName/node_modules/@angular-devkit/architect/src/architect.js:132:40)

ng update说一切都很正常。删除node_modules文件夹，重新进行npm install安装，也没有帮助。

我的项目是基于[ng2-admin(Angular4版本)]。(https://github.com/akveo/ngx-admin)这是我的package.json dependecies。

 "dependencies": {
    "@angular/animations": "^6.0.1",
    "@angular/common": "^6.0.1",
    "@angular/compiler": "^6.0.1",
    "@angular/core": "^6.0.1",
    "@angular/forms": "^6.0.1",
    "@angular/http": "^6.0.1",
    "@angular/platform-browser": "^6.0.1",
    "@angular/platform-browser-dynamic": "^6.0.1",
    "@angular/platform-server": "^6.0.1",
    "@angular/router": "^6.0.1",
    "@ng-bootstrap/ng-bootstrap": "1.0.0-alpha.26",
    "@ngx-translate/core": "^10.0.1",
    "@ngx-translate/http-loader": "^3.0.1",
    "amcharts3": "github:amcharts/amcharts3",
    "ammap3": "github:amcharts/ammap3",
    "angular-table": "^1.0.4",
    "angular2-csv": "^0.2.5",
    "angular2-datatable": "0.6.0",
    "animate.css": "3.5.2",
    "bootstrap": "4.0.0-alpha.6",
    "bower": "^1.8.4",
    "chart.js": "1.1.1",
    "chartist": "0.10.1",
    "chroma-js": "1.3.3",
    "ckeditor": "4.6.2",
    "core-js": "2.4.1",
    "easy-pie-chart": "2.1.7",
    "font-awesome": "4.7.0",
    "fullcalendar": "3.3.1",
    "google-maps": "3.2.1",
    "ionicons": "2.0.1",
    "jquery": "3.2.1",
    "jquery-slimscroll": "1.3.8",
    "leaflet": "0.7.7",
    "leaflet-map": "0.2.1",
    "lodash": "4.17.4",
    "ng2-ckeditor": "1.1.6",
    "ng2-completer": "^1.6.3",
    "ng2-handsontable": "^2.1.0-rc.3",
    "ng2-slim-loading-bar": "^4.0.0",
    "ng2-smart-table": "^1.0.3",
    "ng2-tree": "2.0.0-alpha.5",
    "ngx-uploader": "4.2.4",
    "normalize.css": "6.0.0",
    "roboto-fontface": "0.7.0",
    "rxjs": "^6.1.0",
    "rxjs-compat": "^6.1.0",
    "zone.js": "0.8.26"
  },
  "devDependencies": {
    "@angular/cli": "^6.0.1",
    "@angular/compiler-cli": "^6.0.1",
    "@types/fullcalendar": "2.7.40",
    "@types/jasmine": "2.5.38",
    "@types/jquery": "2.0.41",
    "@types/jquery.slimscroll": "1.3.30",
    "@types/lodash": "4.14.61",
    "@types/node": "6.0.69",
    "codelyzer": "3.0.1",
    "gh-pages": "0.12.0",
    "jasmine-core": "2.5.2",
    "jasmine-spec-reporter": "3.2.0",
    "karma": "1.4.1",
    "karma-chrome-launcher": "2.0.0",
    "karma-cli": "1.0.1",
    "karma-coverage-istanbul-reporter": "0.2.0",
    "karma-jasmine": "1.1.0",
    "karma-jasmine-html-reporter": "0.2.2",
    "npm-run-all": "4.0.2",
    "protractor": "5.1.0",
    "rimraf": "2.6.1",
    "standard-changelog": "1.0.1",
    "stylelint": "7.10.1",
    "ts-node": "2.1.2",
    "tslint": "5.2.0",
    "tslint-eslint-rules": "4.0.0",
    "tslint-language-service": "0.9.6",
    "typescript": "^2.7.2",
    "typogr": "0.6.6",
    "underscore": "1.8.3",
    "wintersmith": "2.2.5",
    "wintersmith-sassy": "1.1.0"
  }

和我的angular.json。

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "ng2-admin": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "outputPath": "dist",
            "index": "src/index.html",
            "main": "src/main.ts",
            "tsConfig": "src/tsconfig.app.json",
            "polyfills": "src/polyfills.ts",
            "assets": [
              "src/assets",
              "src/favicon.ico"
            ],
            "styles": [
              "node_modules/roboto-fontface/css/roboto/sass/roboto-fontface.scss",
              "node_modules/normalize.css/normalize.css",
              "node_modules/font-awesome/scss/font-awesome.scss",
              "node_modules/ionicons/scss/ionicons.scss",
              "node_modules/bootstrap/scss/bootstrap.scss",
              "node_modules/leaflet/dist/leaflet.css",
              "node_modules/chartist/dist/chartist.css",
              "node_modules/fullcalendar/dist/fullcalendar.css",
              "node_modules/handsontable/dist/handsontable.full.css",
              "node_modules/ng2-slim-loading-bar/style.css",
              "src/app/theme/theme.scss",
              "src/styles.scss"
            ],
            "scripts": [
              "node_modules/jquery/dist/jquery.js",
              "node_modules/easy-pie-chart/dist/jquery.easypiechart.js",
              "node_modules/jquery-slimscroll/jquery.slimscroll.js",
              "node_modules/tether/dist/js/tether.js",
              "node_modules/bootstrap/dist/js/bootstrap.js",
              "node_modules/handsontable/dist/handsontable.full.js",
              "node_modules/chroma-js/chroma.js"
            ]
          },
          "configurations": {
            "production": {
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true,
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ]
            }
          }
        },
        "serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "browserTarget": "ng2-admin:build"
          },
          "configurations": {
            "production": {
              "browserTarget": "ng2-admin:build:production"
            }
          }
        },
        "extract-i18n": {
          "builder": "@angular-devkit/build-angular:extract-i18n",
          "options": {
            "browserTarget": "ng2-admin:build"
          }
        },
        "test": {
          "builder": "@angular-devkit/build-angular:karma",
          "options": {
            "main": "src/test.ts",
            "karmaConfig": "./karma.conf.js",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.spec.json",
            "scripts": [
              "node_modules/jquery/dist/jquery.js",
              "node_modules/easy-pie-chart/dist/jquery.easypiechart.js",
              "node_modules/jquery-slimscroll/jquery.slimscroll.js",
              "node_modules/tether/dist/js/tether.js",
              "node_modules/bootstrap/dist/js/bootstrap.js",
              "node_modules/handsontable/dist/handsontable.full.js",
              "node_modules/chroma-js/chroma.js"
            ],
            "styles": [
              "node_modules/roboto-fontface/css/roboto/sass/roboto-fontface.scss",
              "node_modules/normalize.css/normalize.css",
              "node_modules/font-awesome/scss/font-awesome.scss",
              "node_modules/ionicons/scss/ionicons.scss",
              "node_modules/bootstrap/scss/bootstrap.scss",
              "node_modules/leaflet/dist/leaflet.css",
              "node_modules/chartist/dist/chartist.css",
              "node_modules/fullcalendar/dist/fullcalendar.css",
              "node_modules/handsontable/dist/handsontable.full.css",
              "node_modules/ng2-slim-loading-bar/style.css",
              "src/app/theme/theme.scss",
              "src/styles.scss"
            ],
            "assets": [
              "src/assets",
              "src/favicon.ico"
            ]
          }
        },
        "lint": {
          "builder": "@angular-devkit/build-angular:tslint",
          "options": {
            "tsConfig": [
              "src/tsconfig.app.json",
              "src/tsconfig.spec.json"
            ],
            "exclude": []
          }
        }
      }
    },
    "ng2-admin-e2e": {
      "root": "",
      "sourceRoot": "",
      "projectType": "application",
      "architect": {
        "e2e": {
          "builder": "@angular-devkit/build-angular:protractor",
          "options": {
            "protractorConfig": "./protractor.conf.js",
            "devServerTarget": "ng2-admin:serve"
          }
        },
        "lint": {
          "builder": "@angular-devkit/build-angular:tslint",
          "options": {
            "tsConfig": [
              "e2e/tsconfig.e2e.json"
            ],
            "exclude": []
          }
        }
      }
    }
  },
  "defaultProject": "ng2-admin",
  "schematics": {
    "@schematics/angular:component": {
      "prefix": "app",
      "styleext": "scss"
    },
    "@schematics/angular:directive": {
      "prefix": "app"
    }
  }
}
Valeriu
56173
已编辑的问题 5日 十月 2021 в 9:07
编程
angular angular-cli angular6 angular-cli-v6
14日 五月 2018 в 2:38
133 种观点
对该问题的评论 (1)
解决办法

安装@angular-devkit/build-angular作为开发依赖。这个包是Angular 6.0中新引入的。

npm install --save-dev @angular-devkit/build-angular。

或。

yarn add @angular-devkit/build-angular --dev。

Valeriu
56173
编辑本段答案5日 十月 2021 в 9:07
评论(15)
 
npm update

它的工作就像一个魅力。

评论(6)

6角及以上

我的工作方案是

npm install

ng更新

最后

npm更新

评论(3)

需要显式获取devDependencies。

npm i --only=dev
评论(2)

如果以下命令不起作用。

npm install --save-dev @angular-devkit/build-angular

然后移动到项目文件夹并运行此命令。

npm install --save @angular-devkit/build-angular
grg
编辑本段答案27日 六月 2018 в 3:07
评论(1)

以上所有的答案都是正确的，但对我来说并不奏效。 唯一能让我成功的方法是按照步骤/命令来做。

npm uninstall -g @angular/cli@6.0.8
npm cache clean --force
npm install -g @angular/cli@latest
npm install node-sass -g
ng new MY_PROJECT_NAME
cp -r from_my_old_project to_new_MY_PROJECT_NAME
Dinesh Pallapa
编辑本段答案13日 十月 2018 в 5:09
评论(2)

npm install 只要输入 "npm install "并运行，项目就会顺利运行。 或者你可以使用npm install --save-dev @angular-devkit/build-angular。

评论(0)

以下命令有效。

npm install
ng update

-你可能会看到这样的信息"我们分析了你的package.json，一切似乎都正常。 干得好！&quot。

npm update

然后尝试开发构建

ng build

我得到的错误与类型脚本，降级为


npm install typescript@">=3.1.1
Prashant Pimpale
编辑本段答案3日 六月 2019 в 6:03
评论(1)

试试这个。

npm install

npm update

if it's shows something like this.

&gt.运行npm审计修复来修复它们，或npm审计了解详情。 运行 "npm audit fix "来修复它们，或运行 "npm audit "来了解详情。

做到这一点！

评论(2)

针对Angular 8

安装npm-check-updates包。

跑吧

$ npm i npm-check-updates
$ ncu -u
$ npm install

这个软件包将更新所有的软件包并解决这个问题。

注意事项 更新后如果你面临这个问题。

The Angular Compiler中的错误需要TypeScript >=3.4.0和<3.6.0。 =3.4.0和<3.6.0。 但却找到了3.6.3。

然后运行。

$ npm install typescript@3.5.3

来源[链接][1]。

[1]: https://www.freakyjolly.com/how-to-update-local-angular-cli-version/

评论(0)

以下方法对我有效。 不幸的是，没有其他方法。

npm uninstall @angular-devkit/build-angular
npm install @angular-devkit/build-angular
ng update --all --allow-dirty --force
评论(1)

我在使用Angular 7时也有同样的问题。 刚执行了下面的命令，错误就解决了。

npm install --save-dev @angular-devkit/build-angular
评论(0)

先试试这个

npm install --save-dev @angular-devkit/build-angular

如果再次出现丢失软件包的错误，请尝试

npm install
评论(0)

只要执行下面的命令，错误就解决了。

  • ng update @angular/cli @angular/core。

  • npm uninstall @angular-devkit/build-angular。

  • npm install --save-dev @angular-devkit/build-angular。

    if this error could not resolve by above command so you update node version###。

  • npm更新 npm -g

Rajnikant Lodhi
编辑本段答案12日 七月 2019 в 1:13
评论(0)

这对我来说是个好办法，投入然后。

ng update @angular/cli @angular/core
npm install --save-dev @angular/cli@latest
Andrey
编辑本段答案2日 六月 2019 в 9:31
评论(0)

我今天也遇到了同样的问题，在将node从v9升级到v10后，我的环境是由docker设置的。 我的环境是由docker设置的，我不得不从我的DockerFile中删除这个命令。


npm链接@angular/cli
```

它创建了一个指向node安装目录的符号链接。
我猜测其中的`angular/cli`模块和我项目的node_modules dir中的模块版本不一样，这就导致了这个问题。
评论(0)

我刚才也在为同样的问题苦恼。 我的项目是用angular-cli的1.6.0版本生成的。

1. npm update -g @angular/cli

2. editing my package.json changing the line
    "@angular/cli": "1.6.0",
      to
    "@angular/cli": "^1.6.0",

3. npm update

希望我的帮助是有效的ツ

评论(1)
npm install --save-dev @angular-devkit/build-angular@latest

为我解决了这个问题。

评论(0)

当我们运行类似 "ng serve "这样的命令时，它使用的是本地版本的@angular/cli。 所以首先在本地安装最新版本的@angular/cli(不使用-g标志)，然后使用ng update @angular/cli命令更新cli。 然后使用ng update @angular/cli命令更新cli。 我想这样应该可以解决这个问题。 谢谢，我想这样应该可以解决这个问题。

如果你正在更新你的Angular项目，这个链接可能会对你有所帮助https://update.angular.io/。

评论(0)

首先删除node_modules文件夹。

然后 重启系统

运行npm install --save-dev @angular-devkit/build-angular。

和

运行 "npm install"。

评论(0)