<p>我为我的Angular项目创建了以下自定义主题：</p> <pre class="brush:php;toolbar:false;">@use '@angular/material' as mat; /* 您可以在此文件中添加全局样式，也可以导入其他样式文件 */ @include mat.core(); $f-brand: ( 50 : #e0f2f1, 100 : #b3e0db, 200 : #80cbc4, 300 : #4db6ac, 400 : #26a69a, 500 : #009688, 600 : #008e80, 700 : #008375, 800 : #00796b, 900 : #006858, A100 : #97ffec, A200 : #64ffe3, A400 : #31ffda, A700 : #18ffd5, contrast: ( 50 : #000000, 100 : #000000, 200 : #000000, 300 : #000000, 400 : #ffffff, 500 : #ffffff, 600 : #ffffff, 700 : #ffffff, 800 : #ffffff, 900 : #ffffff, A100 : #000000, A200 : #000000, A400 : #000000, A700 : #000000, ) ); $primary: mat.define-palette($f-brand); $theme: mat.define-light-theme($primary); @include mat.all-component-themes($theme);</pre> <p>我还将自定义主题添加到了我的general styles.css文件中，但是当我运行“ng serve”时，出现了以下错误：</p> <pre class="brush:php;toolbar:false;">SassError: $map: null is not a map. ╷ 9 │ $foreground-base: map.get($foreground, base); │ ^^^^^^^^^^^^^^^^^^^^^^^^^^ ╵ node_modules\@angular\material\core\ripple\_ripple-theme.scss 9:21 color() node_modules\@angular\material\core\ripple\_ripple-theme.scss 30:7 @content node_modules\@angular\material\core\theming\_theming.scss 376:3 private-check-duplicate-theme-styles() node_modules\@angular\material\core\ripple\_ripple-theme.scss 27:3 theme() node_modules\@angular\material\core\_core-theme.scss 48:5 @content node_modules\@angular\material\core\theming\_theming.scss 376:3 private-check-duplicate-theme-styles() node_modules\@angular\material\core\_core-theme.scss 47:3 theme() node_modules\@angular\material\core\theming\_all-theme.scss 43:5 @content node_modules\@angular\material\core\theming\_theming.scss 376:3 private-check-duplicate-theme-styles() node_modules\@angular\material\core\theming\_all-theme.scss 42:3 all-component-themes() src\styles-f-theme.scss 44:1 root stylesheet</pre> <p>通过在网上搜索，我发现“map.get”现在似乎是“map-get”。不幸的是，我不知道如何修复这个问题。</p> <p>我项目中使用的Angular版本是“14.0.5”，Angular Material版本是“14.0.4”。</p>

$theme: mat.define-light-theme($primary, $primary);