ng serve命令中找不到@angular-devkit/build-angular:dev-server构建器的实现

113

我尝试按照这个链接更新Angular CLI,但现在我不能运行我的应用程序。当我尝试运行命令ng serve时,它会给我这个错误:

Could not find the implementation for builder @angular-devkit/build-angular:dev-server
Error: Could not find the implementation for builder @angular-devkit/build-angular:dev-server
    at WorkspaceNodeModulesArchitectHost.resolveBuilder (C:\Users\Lupus\Documents\full-stack-projects\financial-app-ui\node_modules\@angular\cli\node_modules\@angular-devkit\architect\node\node-modules-architect-host.js:49:19)
    at ServeCommand.initialize (C:\Users\Lupus\Documents\full-stack-projects\financial-app-ui\node_modules\@angular\cli\models\architect-command.js:135:55)
    at process._tickCallback (internal/process/next_tick.js:68:7)
    at Function.Module.runMain (internal/modules/cjs/loader.js:745:11)
    at startup (internal/bootstrap/node.js:283:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:743:3)

我尝试了我能找到的一切。

  • 我尝试使用命令npm install --save-dev @angular-devkit/build-angular手动安装devkit
  • 我尝试运行命令npm i --only=dev
  • 我尝试运行这些命令

:


  • 我尝试使用命令npm install --save-dev @angular-devkit/build-angular手动安装devkit。
  • 我尝试运行命令npm i --only=dev
  • 我尝试运行这些命令。

:

npm install
ng update
npm update
  • 删除了node_modules文件夹和package-lock.json文件,然后重新运行了所有命令。

没有任何作用。 运行ng v给我这个:

Angular CLI: 8.0.3
Node: 10.15.0
OS: win32 x64
Angular: 8.0.1
... animations, cdk, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.13.9
@angular-devkit/build-angular     0.13.9
@angular-devkit/build-optimizer   0.13.9
@angular-devkit/build-webpack     0.13.9
@angular-devkit/core              7.3.9
@angular-devkit/schematics        8.0.3
@angular/cli                      8.0.3
@ngtools/webpack                  7.3.9
@schematics/angular               8.0.3
@schematics/update                0.800.3
rxjs                              6.5.2
typescript                        3.4.5
webpack                           4.29.0

我的 package.json 文件如下:

{
  "name": "financial-app-ui",
  "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": "^8.0.1",
    "@angular/cdk": "^8.0.1",
    "@angular/common": "^8.0.1",
    "@angular/compiler": "^8.0.1",
    "@angular/core": "^8.0.1",
    "@angular/forms": "^8.0.1",
    "@angular/platform-browser": "^8.0.1",
    "@angular/platform-browser-dynamic": "^8.0.1",
    "@angular/router": "^8.0.1",
    "core-js": "^2.6.9",
    "font-awesome": "^4.7.0",
    "primeicons": "^1.0.0",
    "primeng": "^7.1.3",
    "rxjs": "~6.5.2",
    "tslib": "^1.10.0",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.13.9",
    "@angular/cli": "^8.0.3",
    "@angular/compiler-cli": "^8.0.1",
    "@angular/language-service": "^8.0.1",
    "@types/jasmine": "~2.8.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "~4.5.0",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~1.1.2",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.11.0",
    "typescript": "~3.4.5"
  }
}

还有其他建议吗?

12个回答

2

由于您遇到了这个错误,可能是因为您使用的应用程序使用了旧版本的angular dev,例如0.6.x。

如果您只是简单地卸载并重新安装,很可能会出现其他错误,如“无法找到模块'@ angular / compiler-cli / src / tooling'”或“无法找到模块'@ angular / compiler -cli / ngcc'”,因为似乎angular已经进行了许多更改。

如果您通过更新来解决问题,则可以忽略以下内容。

最好使用下一个版本(相对于0.6.5),该版本不会导致构建错误和ngcc错误。

在我的情况下,正确的版本在构建错误和ngcc错误之间。


0

双重检查版本: 我查看了package.json并检查了所有Angular/Webkit程序的所有版本,删除了给我带来Typescript错误(如rxjsgooglemaps)的版本。

删除package-lock.json。添加所有正确的Angular、Webkit、Typescript等版本...检查过去版本的渲染情况。这意味着在npmjs.com上查看软件包的版本历史记录,并按日期/年龄和版本号进行匹配。在package.json中进行更改并保存。

"dependencies" {
    "@agm/core": "1.0.0",
    "@angular/cdk": "6.1.0",
    "rxjs": "6.0.0",
    "rxjs-compat": "6.0.0",
    ...
},
...
"devDependencies": {
    "@angular-devkit/build-angular": "0.6.1",  // old: "^6.1.0", 
    "@angular/cli": "6.1.0",                   // new: "6.1.0",
    "@angular/compiler-cli": "6.1.0",
    "typescript": "2.7.2"
    ...
}

先从头开始,删除所有旧的模块:

rm -fR ./node_modules/@angular; rm -fR ./node_modules/@angular-devkit/; rm -fR ./node_modules/typescript; rm -fR ./node_modules/rxjs*; rm package-lock.json;

然后重新安装: npm install;

.Pug模板修复:我正在使用一个.pug加载器,所以我不得不手动修复:在node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/common.js文件中,添加以下行,以允许Webpack渲染Pug文件。在该文件内的html规则之后添加此行:

{ test: /.pug$/, use: [ { loader: "apply-loader" }, { loader: "pug-loader" } ] },.

这是模仿Angular 6版本中ng-add-pug-loader.js文件加载.pug文件的做法。


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