Use SCSS style files within AngularDart 5 and Dart 2

1. Add a dev dependency to your pubspec.yaml for sass_builder:^2.0.0.
2. Run pub get to download the new dependencies.
3. Create a sass file ex: lib/app_component.scss and add some styles to it.
4. Add a the compiled css stylesheet to your the @Component annotation in lib/app_component.dart:styleUrls: const ['app_component.css'],

The css file will be generated by sass_builder during the build process.

If you are using angluar_components. One could simply turn it on:

1. Create a build.yaml file with the following content :

   targets:  $default:    builders:      angular_components|scss_builder:        enabled: True

2. Use the following convention for the styleUrl annotations:styleUrls: const ['app_component.scss.css']
3. Write your sass in the *.scss files.

With newest versions:

1. Surprise: In styleUrls are in a different CSS filename (not with the .scss.css extension, just .css; e.g. app_component.css, but the styles are in app_component.scss).

2. Surprise: In app_component.scss, import without lib in the path:

@import 'package:angular_components/app_layout/mixins';

3. I am using this command:

pub run build_runner serve --verbose

See with package info:https://github.com/dart-lang/angular_components/issues/374#issuecomment-636344237