我在看第三章建立一个问题跟踪系统使用React形式'从 * Angular 项目:* 建立现代网络应用程序,通过探索Angular 12与10个不同的项目和尖端技术,第二版由Aristeidis Bampakos。
本章中的项目需要安装Clarity。根据本书(和Clarity文档:https://clarity.design/get-started/developing/angular/),则实现此目的的命令为
ng new foo-project
cd foo-project
ng add @clr/angular
在运行这些命令时,我得到以下输出
ℹ Using package manager: npm
⚠ Unable to find compatible package. Using 'latest' tag.
⚠ Package has unmet peer dependencies. Adding the package may not succeed.
The package @clr/angular@12.0.8 will be installed and executed.
Would you like to proceed? Yes
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: foo-project@0.0.0
npm ERR! Found: @angular/common@13.1.1
npm ERR! node_modules/@angular/common
npm ERR! @angular/common@"~13.1.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/common@"^12.0.0" from @clr/angular@12.0.8
npm ERR! node_modules/@clr/angular
npm ERR! @clr/angular@"12.0.8" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /Users/foo/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/foo/.npm/_logs/2021-12-29T05_20_34_198Z-debug.log
✖ Package install failed, see above.
这是调试日志
# npm resolution error report
2021-12-28T21:01:27.904Z
While resolving: foo-project@0.0.0
Found: @angular/common@13.1.1
node_modules/@angular/common
@angular/common@"~13.1.0" from the root project
Could not resolve dependency:
peer @angular/common@"^12.0.0" from @clr/angular@12.0.8
node_modules/@clr/angular
@clr/angular@"*" from the root project
Fix the upstream dependency conflict, or retry
this command with --force, or --legacy-peer-deps
to accept an incorrect (and potentially broken) dependency resolution.
Raw JSON explanation object:
{
"code": "ERESOLVE",
"current": {
"name": "@angular/common",
"version": "13.1.1",
"whileInstalling": {
"name": "foo-project",
"version": "0.0.0",
"path": "/Users/foo/Projects/Angular/angular-projects-book/foo-project/foo-project"
},
"location": "node_modules/@angular/common",
"isWorkspace": false,
"dependents": [
{
"type": "prod",
"name": "@angular/common",
"spec": "~13.1.0",
"from": {
"location": "/Users/foo/Projects/Angular/angular-projects-book/foo-project/foo-project"
}
}
]
},
"currentEdge": {
"type": "prod",
"name": "@angular/common",
"spec": "~13.1.0",
"from": {
"location": "/Users/foo/Projects/Angular/angular-projects-book/foo-project/foo-project"
}
},
"edge": {
"type": "peer",
"name": "@angular/common",
"spec": "^12.0.0",
"error": "INVALID",
"from": {
"name": "@clr/angular",
"version": "12.0.8",
"whileInstalling": {
"name": "foo-project",
"version": "0.0.0",
"path": "/Users/foo/Projects/Angular/angular-projects-book/foo-project/foo-project"
},
"location": "node_modules/@clr/angular",
"isWorkspace": false,
"dependents": [
{
"type": "prod",
"name": "@clr/angular",
"spec": "*",
"from": {
"location": "/Users/foo/Projects/Angular/angular-projects-book/foo-project/foo-project"
}
}
]
}
},
"strictPeerDeps": false,
"force": false
}
这是我的Angular 副本的版本信息
Angular CLI: 13.1.2
Node: 16.13.1
Package Manager: npm 8.1.2
OS: darwin arm64
Angular: 13.1.1
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1301.2
@angular-devkit/build-angular 13.1.2
@angular-devkit/core 13.1.2
@angular-devkit/schematics 13.1.2
@angular/cli 13.1.2
@schematics/angular 13.1.2
rxjs 7.4.0
typescript 4.5.4
我认为我的Angular版本与npm获取的Clarity版本不兼容。如果是这样,最好的方法是什么?
3条答案
按热度按时间thigvfpy1#
我也有同样的问题。正如书中所说,它适用于Angular 12,我使用的是Angular 12的最后一个版本(Angular 12. 2. 17)。
然后我用不同版本的Clarity进行测试,Clarity 12.0.7对我很有效。
然后我不知道为什么,但编译器没有从Clarity识别UI标签,我只是运行:
然后一切都运行正常!
顺便说一下,我从官方Clarity文档中获得的las命令:https://clarity.design/documentation/get-started
f45qwnt82#
我在用
然后添加到angular.json
然后将这两个模块添加到app. module. ts
我使用了Angular 版本13和版本15,它不支持清晰度
6qfn3psc3#
您可以使用npm强制安装所需的软件包:
此方法不检查依赖项。在生产环境中没有用,但可用于特定包尚未更新且没有最新依赖项的情况
遵循以下网址的其他说明:https://clarity.design/get-started/developing/angular/
另一个选项是降级到Angular 版本12。这允许在没有警告的情况下安装清晰度包。