0

我正在尝试修改具有 Angular 6 并且使用 Angular Material 6.3.3 的项目的主题

目前，我只是从 Material 站点复制代码并按照步骤操作，但是当我尝试运行 ng serve 时弹出错误。

**ERROR** in ./src/styles.css (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./src/styles.css)
Module build failed: Syntax Error

(118:13) Missed semicolon

116 | // We use display: flex on this element exclusively for centering connected overlays.
117 | // When not centering, a top/left/bottom/right will be set which overrides the normal

118 | // flex layout.
| ^
119 | display: flex;
120 |

ℹ ｢wdm｣: Failed to compile.

我的 theme.scss 文件如下所示：

@import '~@angular/material/_theming.scss';

@include mat-core();

$candy-app-primary: mat-palette($mat-indigo);
$candy-app-accent: mat-palette($mat-blue, A200, A100, A400);

$candy-app-warn: mat-palette($mat-red);

$candy-app-theme: mat-light-theme($candy-app-primary, $candy-app-accent, $candy-app-warn);

@include angular-material-theme($candy-app-theme);
4

2 回答 2

1

我发现解决方案是将您的项目完全切换到 SCSS 或仅使用 CSS。Angular Materials 的文档基本上假设您使用的是 SCSS，因此所有内容都需要使用它在 SCSS 中设置样式的项目生成。

因此，总而言之，您要么一直使用 CSS，要么在创建项目时执行 ng new --style=scss

于 2018-07-16T23:25:40.320 回答
0

I think you're importing the wrong thing, it should be:

@import '~@angular/material/theming';
于 2018-07-16T00:08:21.600 回答