主页 / user-18921184

Nietzsche's questions

Martin Hope
Nietzsche
Asked: 2024-08-03 12:36:17 +0800 CST
  • 8

我目前正在将俱乐部应用程序从 Angular 9 重新设计到 18，因为它的维护不太好。我试图尽可能多地保留前端，因此也希望保持设计大致相同。

我发现以下代码在此代码中定义了我们的应用程序的主题：

@import '~@angular/material/theming';
@include mat-core();
$my-app-primary: mat-palette($material-primary);
$my-app-accent:  mat-palette($mat-pink, 500, 900, A100);
$my-app-warn:    mat-palette($mat-red);
$my-app-theme: mat-light-theme($my-app-primary, $my-app-accent, $my-app-warn);
@include angular-material-theme($my-app-theme);

这可以在 colours.scss 中找到，它在我们的旧应用程序的 style.scss 中引用。我想保留所有内容，但从 Angular 17 开始，@importist 不再可用，我应该使用@use（就像这张票一样：https://github.com/angular/components/issues/28204）

我曾尝试自己更改代码，并在 ChatGPT 的帮助下得出了以下结论：

@use '@angular/material' as mat;

@include mat.core();

$my-app-primary: mat.define-palette(mat.$indigo-palette);
$my-app-accent: mat.define-palette(mat.$pink-palette, 500, 900, 'A100');
$my-app-warn: mat.define-palette(mat.$red-palette);

$my-app-theme: mat.define-light-theme((
        color: (
                primary: $my-app-primary,
                accent: $my-app-accent,
                warn: $my-app-warn,
        )
));

@include mat.all-component-themes($my-app-theme);

不幸的是，它不起作用，我收到以下错误：“未知函数：'define-palete'”等等。

有人知道正确的语法是什么吗？即使是 Angular 提供的教程仍然引用旧系统：https://v7.material.angular.io/guide/theming

css