我尝试在this之后更新角度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
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"
}
}
还有其他建议吗?
答案 0 :(得分:15)
我通过重新安装build-angular软件包来完成这项工作。注意安装命令上的“ --save-dev”标志:
npm uninstall @angular-devkit/build-angular
npm install --save-dev @angular-devkit/build-angular
答案 1 :(得分:3)
使用以下命令解决了我的问题:
ng update @angular/cli @angular/core --allow-dirty --force
答案 2 :(得分:1)
我遇到了同样的问题,但就我而言,我试图提供一个Angular项目的下载模板。最初,它在执行ng serve --open
终端命令后给了我这个错误。
发生未处理的异常:
从“ D:\ WORK \ Desarrollo \ plantillas descargadas \ argon-dashboard-angular-master”中找不到模块“ @ angular-devkit / build-angular”。
我解决了以下堆栈溢出问题:https://stackoverflow.com/a/50333128, 但收到以下警告:
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN @ngtools/webpack@7.3.1 requires a peer of @angular/compiler-cli@>=5.0.0
<8.0.0 || ^7.0.0-beta.0 but none is installed. You must install peer dependencies
yourself.
npm WARN ajv-keywords@3.4.1 requires a peer of ajv@^6.9.1 but none is installed. You
must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9
(node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for
fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current:
{"os":"win32","arch":"x64"})
但是尝试命令后出现了这个错误:
ng serve --open
发生未处理的异常:找不到构建器的实现 @ angular-devkit / build-angular:dev-server
我注意到我的node_modules文件夹中缺少一些文件,这可能是由于我当前的连接速度所致。无论如何,我在其他地方的另一台计算机上尝试过,打开了项目本身的克隆并运行了命令:
npm update
然后将项目以.rar文件格式保存到我的工作计算机中,然后将其解压缩,运行我的VS Code,就可以正常工作了。
答案 3 :(得分:1)
ng update
应该已经为您的@angular-devkit/build-angular
我也遇到了这个问题,然后我做了一个新的Angular应用程序,并确保ng serve
在该新创建的Angular应用程序中运行正常。然后,我从工作的Angular应用程序的package.json
复制并使用了以下内容:
`"@angular-devkit/build-angular": "~0.802.2",`
确保您运行npm install
(该版本很可能会随每次Angular更新而改变-因此,请按照我概述的步骤检查您需要使用的版本-如果ng update尚未为您更新它)
答案 4 :(得分:1)
由于收到此错误,因此您可能正在使用使用旧版本的angular开发工具(例如0.6.x)的应用程序
如果只是卸载并重新安装,很可能会收到其他错误,例如“找不到模块'@ angular / compiler-cli / src / tooling'”或找不到模块'@ angular / compiler-cli / ngcc'因为似乎角度已经做了很多改变。
如果仅通过更新即可解决问题,那么请忽略以下内容。
最好使用不会引起构建错误和ngcc错误的下一个版本(相对于0.6.5)。
就我而言,正确的版本介于构建错误和ngcc错误之间。
答案 5 :(得分:0)
确保您在angular.json中具有此配置
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "angular8:build"
},
"configurations": {
"production": {
"browserTarget": "angular8:build:production"
}
}
}
并确保您已安装此软件包
@angular-devkit/build-angular
答案 6 :(得分:0)
仔细检查版本:
我查看了 package.json
并检查了所有 Angular/Webkit 程序的所有版本,删除了那些给我错误的 Typescript 错误,例如 rxjs
和 googlemaps
。
删除 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" } ] },
。
这是模仿 ng-add-pug-loader.js
文件在 Angular 版本 6 中加载 .pug 文件的作用。
答案 7 :(得分:0)
我遇到了同样的问题。只需两个命令就解决了我的问题
npm uninstall @angular-devkit/build-angular
npm install --save-dev @angular-devkit/build-angular
//OR
npm install @angular-devkit/build-angular
如果这不起作用。别担心。运行这个命令。
ng update @angular/cli @angular/core --allow-dirty --force
答案 8 :(得分:0)
在 angular.json 中将此行 "builder": "@angular-builders/build-angular:browser",
更改为 "builder": "@angular-devkit/build-angular:browser",
解决了我的问题。