尝试将material-ui添加到jhipster项目时出现错误

问题描述 投票:0回答:2

我创建了一个 jhipster 应用程序,使用 Angular 作为前端 ui 框架。下面给出了jhipster和node版本。

jhipster: 7.9.3,
npm: '9.6.5',
node: '18.16.0',

现在我想添加 matrerial-ui 来创建响应式应用程序。为此,我运行了以下命令。

添加@Angular/Material

但是我收到以下错误日志。

i Using package manager: npm
√ Found compatible package version: @angular/[email protected].
√ Package information loaded.

The package @angular/[email protected] 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: [email protected]
npm ERR! Found: @angular/[email protected]
npm ERR! node_modules/@angular/core
npm ERR!   @angular/core@"14.2.0" from the root project
npm ERR!   peer @angular/core@">=7.0.0" from @angular/[email protected]
npm ERR!   node_modules/@angular/material
npm ERR!     @angular/material@"7.0.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/core@"16.1.2" from @angular/[email protected]
npm ERR! node_modules/@angular/animations
npm ERR!   peer @angular/animations@">=7.0.0" from @angular/[email protected]
npm ERR!   node_modules/@angular/material
npm ERR!     @angular/material@"7.0.0" 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!
npm ERR! For a full report see:
npm ERR! C:\Users\sanal\AppData\Local\npm-cache\_logs\2023-06-28T09_04_45_754Z-eresolve-report.txt

npm ERR! A complete log of this run can be found in: C:\Users\sanal\AppData\Local\npm-cache\_logs\2023-06-28T09_04_45_754Z-debug-0.log
× Packages installation failed, see above.

我也尝试了“ng add @angular/material --legacy-peer-deps”。但它也不起作用。

我尝试升级 Angular cli 和 core。那些时候我得到了以下错误。

>ng update @angular/core
The installed Angular CLI version is outdated.
Installing a temporary Angular CLI versioned 16.1.1 to perform the update.
√ Packages successfully installed.
Using package manager: npm
Collecting installed dependencies...
Found 59 dependencies.
Fetching dependency metadata from registry...
Updating multiple major versions of '@angular/core' at once is not supported. Please migrate each major version individually.
Run 'ng update @angular/core@15' in your workspace directory to update to latest '15.x' version of '@angular/core'.

For more information about the update process, see https://update.angular.io/?v=14.0-15.0

在jhipster项目中升级Angular和安装material-ui的正确方法是什么?

angular material-ui jhipster
2个回答
1
投票

在手动一一升级每个依赖项后,我能够安装材质 UI。我使用了以下命令,

ng update @angular/cli@15 --force
ng update @angular/cli@16 --force
ng update @angular-builders/custom-webpack
ng update @angular-builders/jest
ng update @fortawesome/angular-fontawesome
ng update @ng-bootstrap/ng-bootstrap
ng update jest-preset-angular
ng update ngx-infinite-scroll
ng update ngx-webstorage
ng update ts-jest

(注意:每次升级后都会要求您提交更改。)

如果有比这更简单的方法,请分享。

升级 Angular 后,我在导入 scss 样式表时遇到问题。我更改了路径并使用样式表的相对路径。

这个问题解释了问题并提供了答案。


0
投票

同样的问题:任何更简单的解决方案:@matt-raible?谢谢

© www.soinside.com 2019 - 2024. All rights reserved.