在AngularDart 5和Dart 2中使用SCSS样式文件

Question

我正在使用Dart 2和AngularDart 5。

⚠我在网上搜索了我的问题，但我找不到满意的答案。

❔我的AngularDart应用程序中是否可以解释我需要包含的所有步骤以及使用SCSS样式文件？

我开始使用quickstart应用程序，你可以找到here。

谢谢！

Answer 1

1. 为你的pubspec.yaml为

   sass_builder:
   ^2.0.0

   添加一个dev依赖项。
2. 运行pub get以下载新的依赖项。
3. 创建一个sass文件ex：lib/app_component.scss并添加一些样式。
4. 将已编译的css样式表添加到lib/app_component.dart中的@Component注释：styleUrls: const ['app_component.css'],

在构建过程中，sass_builder将生成css文件。

Answer 2

如果您正在使用angular_components。人们可以简单地打开它：

1. 使用以下内容创建build.yaml文件：

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

2. 对styleUrl注释使用以下约定：styleUrls: const ['app_component.scss.css']
3. 在*.scss文件中写下你的sass。