Angular 5 material new palette not compiling

问题

I'm trying to generate a new material theme with a custom palette for the primary color, the scss code is below:

@import '~@angular/material/theming';
@include mat-core();

$potti-brown: (
    50: #fcf2e7,
    100: #f8dec3,
    200: #f3c89c,
    300: #eeb274,
    400: #eaa256,
    500: #e69138,
    600: #e38932,
    700: #df7e2b,
    800: #db7424,
    900: #d56217,
    A100: #ffffff,
    A200: #ffe3d4,
    A400: #ffc3a1,
    A700: #ffb287,
    contrastDefaultColor: light,
    contrastDarkColors: (
      50,
      100,
      200,
      300,
      400,
      500,
      600,
      700,
      800,
      A100,
      A200,
      A400,
      A700
    ),
    contrastLightColors: (
      900
    )
);

$potti-primary: mat-palette($potti-brown);
$potti-accent:  mat-palette($mat-lime, 100);
$potti-warn:    mat-palette($mat-red);

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

@include angular-material-theme($potti-theme);

I've followed the tutorials on angular.io, but when I try to ng serve, I get the following error:

ERROR in ./node_modules/css-loader?{"sourceMap":false,"import":false}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/styles/app.scss
Module build failed:
undefined
         ^
      Argument `$map` of `map-get($map, $key)` must be a map

Backtrace:
        node_modules/@angular/material/_theming.scss:1114, in function `map-get`
        node_modules/@angular/material/_theming.scss:1114, in function `mat-contrast`
        node_modules/@angular/material/_theming.scss:1129, in function `mat-palette`
        src/styles/pottiTheme.scss:40
      in E:\potti2\pottiRoma-master\pottiRoma-master\PottiRoma\AdminWebPottiRoma\node_modules\@angular\material\_theming.scss (line 1114, column 11)
Error:
undefined
         ^
      Argument `$map` of `map-get($map, $key)` must be a map

Backtrace:
        node_modules/@angular/material/_theming.scss:1114, in function `map-get`
        node_modules/@angular/material/_theming.scss:1114, in function `mat-contrast`
        node_modules/@angular/material/_theming.scss:1129, in function `mat-palette`
        src/styles/pottiTheme.scss:40
      in E:\potti2\pottiRoma-master\pottiRoma-master\PottiRoma\AdminWebPottiRoma\node_modules\@angular\material\_theming.scss (line 1114, column 11)
    at options.error (E:\potti2\pottiRoma-master\pottiRoma-master\PottiRoma\AdminWebPottiRoma\node_modules\node-sass\lib\index.js:291:26)
 @ ./src/styles/app.scss 4:14-197
 @ multi ./node_modules/font-awesome/css/font-awesome.css ./src/styles/app.scss ./src/styles/pottiTheme.scss ./node_modules/ngx-toastr/toastr.css
ERROR in ./node_modules/css-loader?{"sourceMap":false,"import":false}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/styles/pottiTheme.scss
Module build failed:
undefined
         ^
      Argument `$map` of `map-get($map, $key)` must be a map

Backtrace:
        node_modules/@angular/material/_theming.scss:1114, in function `map-get`
        node_modules/@angular/material/_theming.scss:1114, in function `mat-contrast`
        node_modules/@angular/material/_theming.scss:1129, in function `mat-palette`
        stdin:40
      in E:\potti2\pottiRoma-master\pottiRoma-master\PottiRoma\AdminWebPottiRoma\node_modules\@angular\material\_theming.scss (line 1114, column 11)
Error:
undefined
         ^
      Argument `$map` of `map-get($map, $key)` must be a map

Backtrace:
        node_modules/@angular/material/_theming.scss:1114, in function `map-get`
        node_modules/@angular/material/_theming.scss:1114, in function `mat-contrast`
        node_modules/@angular/material/_theming.scss:1129, in function `mat-palette`
        stdin:40
      in E:\potti2\pottiRoma-master\pottiRoma-master\PottiRoma\AdminWebPottiRoma\node_modules\@angular\material\_theming.scss (line 1114, column 11)
    at options.error (E:\potti2\pottiRoma-master\pottiRoma-master\PottiRoma\AdminWebPottiRoma\node_modules\node-sass\lib\index.js:291:26)
 @ ./src/styles/pottiTheme.scss 4:14-204
 @ multi ./node_modules/font-awesome/css/font-awesome.css ./src/styles/app.scss ./src/styles/pottiTheme.scss ./node_modules/ngx-toastr/toastr.css

The compilation process works if instead of using the custom palette I use a standart angular material palette like $mat-lime.

Can someone point it out to me where I'm getting this wrong? I'm sure it's a stupid little thing that I'm doing wrong.

EDIT SOLVED:

@yurzui helped me out with the $mat-lime source code and I just adapted the colors to the ones on my palette and it worked fine! There must have been some syntax error since i used an angular 2 theme generator. The correct code is below:

$potti-brown: (
  50: #fcf2e7,
  100: #f8dec3,
  200: #f3c89c,
  300: #eeb274,
  400: #eaa256,
  500: #e69138,
  600: #e38932,
  700: #df7e2b,
  800: #db7424,
  900: #d56217,
  A100: #ffffff,
  A200: #ffe3d4,
  A400: #ffc3a1,
  A700: #ffb287,
  contrast: (
    50: $dark-primary-text,
    100: $dark-primary-text,
    200: $dark-primary-text,
    300: $dark-primary-text,
    400: $dark-primary-text,
    500: $dark-primary-text,
    600: $dark-primary-text,
    700: $dark-primary-text,
    800: $dark-primary-text,
    900: $light-primary-text,
    A100: $dark-primary-text,
    A200: $dark-primary-text,
    A400: $dark-primary-text,
    A700: $dark-primary-text,
  )
);

来源：https://stackoverflow.com/questions/49086881/angular-5-material-new-palette-not-compiling