logo标签列表

如何更新 Angular Material

angularangular-material2
38

如何将项目中的Angular Material更新到最新版本material@2.0.0-alpha.8-3？请问最佳方法是什么？

我已经尝试了：

npm install --save @angular/material @angular/cdk
8个回答
48
您需要使用npm update命令。例如，如下所示。
npm update @angular/material @angular/cdk

这将安装最新的稳定版本。如果您想针对特定版本进行安装，则需要在@符号后面添加版本来指定。

此外，您可以使用以下命令检查过时的软件包：

npm outdated

以下是 npm update 的文档。

https://docs.npmjs.com/cli/update

6
自从npm 5版本开始，“--save”标志不再需要，因为这现在是默认设置。 - TmTron
它没有更新任何东西。我需要使用“ng”而不是“npm”。 - Ap0st0l
44

使用以下命令：

ng update @angular/material

注意：最近我使用了这个命令从版本8升级到版本9。我没有测试过它在旧版本中的效果。对于版本9之后的所有版本都可以正常工作。

2
我也尝试使用npm update从9更新到10，但没有任何反应，但ng update对我有效。 - RRR
4
@RenjithP.N。是的，ng update 是升级 Angular 和 Angular Material 的正确方法。在使用 ng update 进行升级时，它还会对文件进行一些必要的更改，而 npm update 不会执行这些更改。 - Debiprasad
14
以下步骤帮助我将 Material Theme 从 v9 更新到 v10。 首先删除旧的包。
npm remove @angular/material @angular/cdk

然后安装最新的软件包

npm add @angular/material @angular/cdk
2
我之前遇到了一个问题，无法将版本从7.0.0更新到15.x.x，但是您提供的解决方案起作用了。谢谢。 - Amrinder Singh
1
这对我也起作用。我的应用程序使用的是Angular 15，但仍然引用了Angular Material 8。由于Angular版本大于依赖项，并且ng update不允许跳过主要版本，所以我无法使用ng update从v 8升级到v 9。另外，如果您想升级到特定版本，可以使用npm add @angular/material@15 @angular/cdk@15。 - Billy Rudasill
4

方法 1

你尝试过使用简单的 npm i @angular/material 吗？根据 npmjs 上的报告，它会获取最新版本。

方法 2

删除文件 package-lock.json 并检查你的 package.json 是否与最新的 Angular Material 版本保持一致，然后只需执行 npm i 即可。

没有对我起作用。 - Nimasha Madhushani
3

最好使用Angular工具升级ng update，方法如下：

ng update @angular/material @angular/cli

在一些罕见的情况下，当您涉及某些材料混合时，此 Angular API 无法正常工作。在这种情况下，我建议使用 npm（或对其熟悉的人使用 yarn），如下所示：

# Removing the material previous version files from node_modules in the explorer or with the command
npm remove @angular/material @angular/cdk
# Or by using yarn:
yarn remove @angular/material @angular/cdk

# And re-install the new version of the packages:
npm i @angular/material@latest @angular/cdk@latest
# with yarn it gives:
yarn add @angular/material@latest @angular/cdk@latest
2

您应该始终尝试使用ng update @angular/material，因为它不仅会更新软件包，还会迁移您的代码，例如导入等。

我从7迁移到11，导入从 import { MatSnackBar } from '@angular/material'; 变成了 import { MatSnackBar } from '@angular/material/snack-bar';

大家好，我们需要将Angular 7升级到带有Angular Material的Angular 11。但是我们遵循了这个链接"https://update.angular.io/?l=2&v=7.0-11.0"，但是出现了很多错误。请问有什么帮助线路吗？ - Adhi Venkatesh
1
first remove from `package-lock.json` this
  // "@angular/material": {
    //   "version": "6.4.7",
    //   "resolved": "https://registry.npmjs.org/@angular/material/-/material-6.4.7.tgz",
    //   "integrity": "sha512-SdNx7Xovi24Kw9eU6lkLhY/7f2M7L9F+/uh6XuPr4jbGgCUVVpeeVI5ztZhsZRbj1sN+/r1p5w8u62apWWl5Ww==",
    //   "requires": {
    //     "parse5": "^5.0.0",
    //     "tslib": "^1.7.1"
    //   },
    //   "dependencies": {
    //     "parse5": {
    //       "version": "5.1.0",
    //       "resolved": "https://registry.npmjs.org/parse5/-/parse5-5.1.0.tgz",
    //       "integrity": "sha512- 
fxNG2sQjHvlVAYmzBZS9YlDp6PTSSDwa98vkD4QgVDDCAo84z5X1t5XyJQ62ImdLXx5NdIIfihey6xpum9/gRQ==",
    //       "optional": true
    //     }
    //   }
    // },
// "@angular/cdk": {
//   "version": "7.3.7",
//   "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-7.3.7.tgz",
//   "integrity": "sha512-xbXxhHHKGkVuW6K7pzPmvpJXIwpl0ykBnvA2g+/7Sgy5Pd35wCC+UtHD9RYczDM/mkygNxMQtagyCErwFnDtQA==",
//   "requires": {
//     "parse5": "^5.0.0",
//     "tslib": "^1.7.1"
//   },
//   "dependencies": {
//     "parse5": {
//       "version": "5.1.0",
//       "resolved": "https://registry.npmjs.org/parse5/-/parse5-5.1.0.tgz",
//       "integrity": "sha512-fxNG2sQjHvlVAYmzBZS9YlDp6PTSSDwa98vkD4QgVDDCAo84z5X1t5XyJQ62ImdLXx5NdIIfihey6xpum9/gRQ==",
//       "optional": true
//     }
//   }
// },


 second remove from `package.json` this line
      // "@angular/material": "^6.4.7",
      // "@angular/cdk": "^7.3.7",


then finaly run this
  npm install --save @angular/material @angular/cdk
0

如何从现有的低版本更新 Angular Material

  1. 删除现有的包

npm remove @angular/material @angular/cdk

  1. 添加新的包

npm add @angular/material @angular/cdk

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