Ionic - SCSS - '[scss] ) expected' && '[scss] { expected' error messages

Question

I am fairly new to Ionic and I'm using the ionic 2 beta using angular 2. Now this works with Sass. And ionic generates their default styling in your application app/theme/app.variables.css where the primaryand secondary etc. colors are defined. The default scss file they give you looks like this:

// http://ionicframework.com/docs/v2/theming/

// Ionic Shared Functions
// --------------------------------------------------
// Makes Ionic Sass functions available to your App

@import "globals.core";

// App Shared Variables
// --------------------------------------------------
// To customize the look and feel of this app, you can override
// the Sass variables found in Ionic's source scss files. Setting
// variables before Ionic's Sass will use these variables rather than
// Ionic's default Sass variable values. App Shared Sass imports belong
// in the app.core.scss file and not this file. Sass variables specific
// to the mode belong in either the app.ios.scss or app.md.scss files.


// App Shared Color Variables
// --------------------------------------------------
// It's highly recommended to change the default colors
// to match your app's branding. Ionic uses a Sass map of
// colors so you can add, rename and remove colors as needed.
// The "primary" color is the only required color in the map.
// Both iOS and MD colors can be further customized if colors
// are different per mode.

$colors: (
  primary:    #387ef5,
  secondary:  #32db64,
  danger:     #f53d3d,
  light:      #f4f4f4,
  dark:       #222,
  favorite:   #69BB7B
);

And, as provided in their docs, this is the correct code. (although they don't include favorite).

btw the extra comma on the end of dark doesn't change anything

Now the problem is that I get 2 errors. 1 on the primary: #387ef5, at the colon. Saying [scss] ) expected.

And 1 on the secondary: #32db64, on the colon saying [scss] { expected.

Answer 1

simply do this:

$colors: (
  'primary':    #387ef5,
  'secondary':  #32db64,
  'danger':     #f53d3d,
  'light':      #f4f4f4,
  'dark':       #222,
  'favorite':   #69BB7B
);