Angular 角度2自定义主题，SCSS错误

我是Angular 2的新手，也是SCSS的新手（我一直使用css）。我正在尝试为我的angular cli项目设置一个自定义主题，该主题与我们的品牌颜色一起使用

我发现了一个stackoverflow问题（），我认为这个问题可以解决，但遗憾的是，我遇到了一个错误，它看起来像Angular 2解析我的.scss自定义主题文件时遇到的问题。我已在应用程序根目录下的angular-cli.json中添加了必要的.scss文件，并将新的.scss文件放在src文件夹中，与最初由angular cli项目设置程序创建的style.css一起。下面是我创建的.scss文件

@import '~@angular/material/core/theming/all-theme';

@include md-core();

$ae-brand-indigo: (
    50: #e0ebf3,
    100: #b3cee1,
    200: #80adce,
    300: #4d8cba,
    400: #2673ab,
    500: #005a9c,
    600: #005294,
    700: #00488a,
    800: #003f80,
    A200: #6a9bff,
    A400: #3778ff,
    A700: #1e67ff,
    contrast: (
        50: $black-87-opacity,
        100: $black-87-opacity,
        200: $black-87-opacity,
        300: $black-87-opacity,
        500: white,
        600: white,
        700: white,
        800: white,
        900: white,
        A100: $black-87-opacity,
        A200: $black-87-opacity,
        A400: $black-87-opacity,
        A700: white,
    )
 );

$ae-brand-orange: (
    50: #fef3e4,
    100: #fde0bb,
    200: #fccc8e,
    300: #fab861,
    400: #f9a83f,
    500: #f8991d,
    600: #f7911a,
    700: #f68615,
    800: #f57c11,
    900: #f36b0a,
    A100: #ffffff,
    A200: #fff1e9,
    A400: #ffd1b6,
    A700: #ffc19c,
    contrast: (
        50: $black-87-opacity,
        100: $black-87-opacity,
        200: $black-87-opacity,
        300: $black-87-opacity,
        400: $black-87-opacity,
        500: white,
        600: white,
        700: white,
        800: white,
        900: white,
        A100: $black-87-opacity,
        A200: $black-87-opacity,
        A400: $black-87-opacity,
        A700: white,
   )
 );

// mandatory stuff for theming
$ae-primary: md-palette(ae-brand-indigo);
$ae-accent:  md-palette($ae-brand-orange);
$ae-warn: md-palette($md-red);

// include the custom theme components into a theme object
$ae-main-theme: md-light-theme($ae-primary, $ae-accent, $ae-warn);

// include the custom theme object into the angular material theme
@include angular-material-theme($ae-main-theme);

在构建和启动我的dev服务器时，我遇到以下错误

错误 ./~/css加载器/~/邮政编码加载器/~/sass加载器/src/ae干管-
theme.scss模块生成失败：未定义 ^

map get（$map，$key）

的参数

$map

必须是映射

回溯： 节点模块/@angular/material/core/theming/\u theming.scss:19，in
函数

map get

节点_modules/@angular/material/core/theming/_theming.scss:19，in 功能

md调色板

标准时间：76 在C:\Users\jstafford\Desktop\working\ae-
ui\node\u modules\@angular\material\core\theming\u theming.scss（第19行， 第14栏） @./src/ae-main-theme.scss 4:14-166 @多种风格

./src/ae main-theme.scss）`中的错误必须是地图

---

现在，我知道我在这里定义了一个自定义调色板。我在material 2入门页面上看到的唯一示例使用$md red、$md indigo以及预定义的不同颜色。有谁能帮我把这个工作，这样我就可以真正定制我所看到的我遗漏了什么？

我忘记了indigo变量上的

$

符号（这就是导致解析器异常的原因）：

我还添加了我对原色和副色的选择：

$primary-color: map-get($ae-primary-palette, 500);
$secondary-color: map-get($ae-accent-palette, 500);

---

我在indigo变量上忘记了一个

$

符号（这就是导致解析器异常的原因）：

我还添加了我对原色和副色的选择：

$primary-color: map-get($ae-primary-palette, 500);
$secondary-color: map-get($ae-accent-palette, 500);

---

作为scss的新手，我将导入“变量”忽略掉了，因为我认为这对于最初在我引用的stackoverflow问题中提出这个问题的人的scss设置来说是独一无二的。不确定这是否与我的问题有关。作为scss的新手，我忽略了导入“变量”，因为我认为这是最初在我引用的stackoverflow问题中提出此问题的人的scss设置所特有的。不确定这是否与我的问题有关。