找不到模块“@ angular-devkit / build-angular”

时间:2018-05-17 23:08:39

标签: node.js angular npm-install package.json angular6

使用npm,我按照Angular CLI快速入门页面上的入门指示进行操作。

Angular CLI Quickstart

创建并进入我的新项目后运行ng serve --open"前端"给出了这个错误:

Could not find module "@angular-devkit/build-angular" from "C:\\Users\\Brandon\\project-name\\frontend".
Error: Could not find module "@angular-devkit/build-angular" from "C:\\Users\\Brandon\\project-name\\frontend".
 at Object.resolve (C:\Users\Brandon\project-name\node_modules\@angular-devkit\core\node\resolve.js:141:11)
 at Observable.rxjs_1.Observable [as _subscribe] (C:\Users\Brandon\project-name\node_modules\@angular-devkit\architect\src\architect.js:132:40)

我尝试过与我类似的其他问题的建议,但是没有用。答案是运行npm install --save-dev @angular-devkit/build-angular

Similar Question

我还删除了模块,清除了缓存,然后进行了安装,但也无效。

的package.json:

{
 "name": "frontend",
 "version": "0.0.0",
 "scripts": {
   "ng": "ng",
   "start": "ng serve",
   "build": "ng build",
   "test": "ng test",
   "lint": "ng lint",
   "e2e": "ng e2e"
 },
"private": true,
"dependencies": {
  "@angular/animations": "^6.0.2",
  "@angular/common": "^6.0.2",
  "@angular/compiler": "^6.0.2",
  "@angular/core": "^6.0.2",
  "@angular/forms": "^6.0.2",
  "@angular/http": "^6.0.2",
  "@angular/platform-browser": "^6.0.2",
  "@angular/platform-browser-dynamic": "^6.0.2",
  "@angular/router": "^6.0.2",
  "core-js": "^2.5.4",
  "rxjs": "^6.0.0",
  "zone.js": "^0.8.26"
 },
"devDependencies": {
  "@angular/compiler-cli": "^6.0.2",
  "@angular-devkit/build-angular": "~0.6.3",
  "typescript": "~2.7.2",
  "@angular/cli": "^6.0.3",
  "@angular/language-service": "^6.0.2",
  "@types/jasmine": "~2.8.6",
  "@types/jasminewd2": "~2.0.3",
  "@types/node": "~8.9.4",
  "codelyzer": "~4.2.1",
  "jasmine-core": "~2.99.1",
  "jasmine-spec-reporter": "~4.2.1",
  "karma": "~1.7.1",
  "karma-chrome-launcher": "~2.2.0",
  "karma-coverage-istanbul-reporter": "~1.4.2",
  "karma-jasmine": "~1.1.1",
  "karma-jasmine-html-reporter": "^0.2.2",
  "protractor": "~5.3.0",
  "ts-node": "~5.0.1",
  "tslint": "~5.9.1"
 }
}

angular.json:

 {
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "frontend": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "prefix": "app",
      "schematics": {},
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "outputPath": "dist/frontend",
            "index": "src/index.html",
            "main": "src/main.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.app.json",
            "assets": [
              "src/favicon.ico",
              "src/assets"
            ],
            "styles": [
              "src/styles.css"
            ],
            "scripts": []
          },
          "configurations": {
            "production": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ],
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true
            }
          }
        },
        "serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "browserTarget": "frontend:build"
          },
          "configurations": {
            "production": {
              "browserTarget": "frontend:build:production"
            }
          }
        },
        "extract-i18n": {
          "builder": "@angular-devkit/build-angular:extract-i18n",
          "options": {
            "browserTarget": "frontend:build"
          }
        },
        "test": {
          "builder": "@angular-devkit/build-angular:karma",
          "options": {
            "main": "src/test.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.spec.json",
            "karmaConfig": "src/karma.conf.js",
            "styles": [
              "src/styles.css"
            ],
            "scripts": [],
            "assets": [
              "src/favicon.ico",
              "src/assets"
            ]
          }
        },
        "lint": {
          "builder": "@angular-devkit/build-angular:tslint",
          "options": {
            "tsConfig": [
              "src/tsconfig.app.json",
              "src/tsconfig.spec.json"
            ],
            "exclude": [
              "**/node_modules/**"
            ]
          }
        }
      }
    },
    "frontend-e2e": {
      "root": "e2e/",
      "projectType": "application",
      "architect": {
        "e2e": {
          "builder": "@angular-devkit/build-angular:protractor",
          "options": {
            "protractorConfig": "e2e/protractor.conf.js",
            "devServerTarget": "frontend:serve"
          }
        },
        "lint": {
          "builder": "@angular-devkit/build-angular:tslint",
          "options": {
            "tsConfig": "e2e/tsconfig.e2e.json",
            "exclude": [
              "**/node_modules/**"
            ]
          }
        }
      }
    }
  },
  "defaultProject": "frontend"
}

18 个答案:

答案 0 :(得分:8)

  

在创建并进入我的新项目“前端”后运行ng serve --open出现此错误:

创建项目后,您需要运行

npm install 

安装package.json中列出的所有依赖项

答案 1 :(得分:1)

另一个问题可能与您的开发依赖性有关。 请检查它们是否已正确安装(检查它们是否在node_modules文件夹中)

如果没有,那么快速解决方法是:

npm i --only=dev

或检查有关产品的npm设置如何:

npm config get production

如果将它们设置为true,请将其更改为false:

npm config set -g production false

并设置一个新的角度项目。

在此处找到该提示: https://github.com/angular/angular-cli/issues/10661 (ken107和lichunbin814)

希望有帮助。

答案 2 :(得分:1)

安装@ angular-devkit / build-angular作为dev依赖项。该软件包是Angular 6.0中新引入的

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

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

答案 3 :(得分:0)

尝试安装angular-devkit来构建角度项目

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

答案 4 :(得分:0)

从角度6开始,您可以运行以下命令来解决该问题

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

OR

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

如果您仍然无法解决问题,则可以从an unhandled exception occurred: cannot find module '@angular-devkit/build-angular/package.json'看到其他选项

答案 5 :(得分:0)

我尝试了上面列出的所有可能的命令,但没有一个对我有用, 检查 Package.json 是否包含“ @ angular-devkit / build-angular”(如果不使用它进行安装)(在我的情况下,版本0.803.19有效)

  

npm我@ angular-devkit / build-angular @ 0.803.19

或在npm网站存储库中签出以选择版本

答案 6 :(得分:0)

运行以下命令以解决该问题。每当您拉出一个新项目时,几乎不会将任何依赖项添加到工作目录中。运行以下命令以解决该问题

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

答案 7 :(得分:0)

如果您要从7号角更新到8号角,请执行此操作

ng update @angular/cli @angular/core

有关更多信息,请点击此处https://github.com/just-jeb/angular-builders/blob/master/MIGRATION.MD

答案 8 :(得分:0)

以上所有方法均无效... NPM可能有问题

Yarn 

很有帮助..

Yarn Install

答案 9 :(得分:0)

这对我有用:在命令行中输入npm audit fix。之后,我可以再次使用ng serve --open

答案 10 :(得分:0)

如果您使用的是角度版本8,请运行以下命令来解决此问题。

ng update @angular/cli @angular/core

答案 11 :(得分:0)

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

答案 12 :(得分:0)

我查看了node_modules的内部,显然,仅安装了依赖项,没有安装devDependencies。使用新的NPM,我们需要显式获取devDependencies:

npm i --only=dev

如果您只想安装devkit:

npm install @angular-devkit/build-angular

与ken107(github)

的共同构想

答案 13 :(得分:0)

我遇到了同样的问题,因为它没有安装

  

@ angular-devkit / build-angular

对我有用的答案是:

  

npm i --only = dev

答案 14 :(得分:0)

使用npm update或 运行`npm install --save-dev @ angular-devkit / build-angular

`

答案 15 :(得分:0)

D:project / contactlist npm安装 然后 D:新客户的项目/联系人列表

D:项目/联系人列表/客户服务

这对我有用,因为某些原因,我不得不删除客户端文件夹并从contactlist文件夹开始npm install。我尝试了所有事情,甚至清除了缓存,终于奏效了。

答案 16 :(得分:0)

我刚遇到此问题,并已解决。我认为此问题的根本原因是ng,当前版本的node.js(10.6.0)和随附的npm不同步。我已经安装了LTS版本的node.js(8.11.3),问题消失了。

答案 17 :(得分:0)

我在一分钟前就遇到了同样的问题。我的项目是使用angular-cli 1.6.0版生成的。

npm更新-g @ angular / cli 编辑我的package.json更改行 “ @ angular / cli”:“ 1.6.0”, 至 “ @ angular / cli”:“ ^ 1.6.0”, npm更新 做到了。