如何确定Angular项目所用Material Design版本及MD2最新包版本？

一、Material Design 2 对应的 Angular Material 最新版本 #

Angular Material 6.x 至 14.x 版本完全基于 Material Design 2 规范开发，15.x 及以上版本全面转向 Material Design 3。因此，基于 Material Design 2 的@angular/material和@angular/cdk最新稳定版本为 14.2.7（14.x 分支的最终维护版本）。

二、版本锁定操作步骤 #

1. 安装指定版本
   新项目直接安装：

   npm install @angular/material@14.2.7 @angular/cdk@14.2.7
   

   现有项目调整版本：

   npm uninstall @angular/material @angular/cdk
   npm install @angular/material@14.2.7 @angular/cdk@14.2.7
   

2. 防止自动升级
   修改package.json中的依赖版本为固定值（移除^或~前缀）：

   "@angular/material": "14.2.7",
   "@angular/cdk": "14.2.7"
   

三、Material Design 2 主题配置 #

确保全局样式使用 Material Design 2 主题体系：
在styles.scss中导入并配置主题：

@import '@angular/material/theming';
// 定义调色板
$app-primary: mat-palette($mat-indigo);
$app-accent: mat-palette($mat-pink, A200, A100, A400);
$app-warn: mat-palette($mat-red);
// 创建并应用主题
$app-theme: mat-light-theme($app-primary, $app-accent, $app-warn);
@include angular-material-theme($app-theme);

注意：避免导入@angular/material/mdc-theming等 Material Design 3 相关文件

内容的提问来源于stack exchange，提问作者Bullsized