build: dev-app with bazel (#14162)

Author: devversion

src/a11y-demo/BUILD.bazel

@@ -9,7 +9,7 @@ sass_generate_binaries("a11y_demo_scss", glob(["**/*.scss"]))
 
 ng_module(
   name = "a11y-demo",
-  srcs = glob(["**/*.ts"], exclude=["**/*.spec.ts"]),
+  srcs = glob(["**/*.ts"]),
   assets = glob(["**/*.html"]) + [":a11y_demo_scss"],
   deps = [
     "@angular//packages/core",

src/dev-app/BUILD.bazel

@@ -0,0 +1,41 @@
+package(default_visibility=["//visibility:public"])
+
+load("@io_bazel_rules_sass//:defs.bzl", "sass_binary")
+load("//:packages.bzl", "MATERIAL_TARGETS", "CDK_TARGETS")
+load("//tools:defaults.bzl", "ng_module")
+load("//tools:sass_generate_binaries.bzl", "sass_generate_binaries")
+
+# Generate sass binaries for all nested SCSS files.
+sass_generate_binaries("dev_app_scss", glob(["**/*.scss"], exclude = ["theme.scss"]), [
+  # Needed for the input-demo sass file that uses CDK text-field mixins.
+  "//src/cdk/text-field:text_field_scss_lib"
+])
+
+ng_module(
+  name = "dev-app",
+  srcs = glob(["**/*.ts"], exclude = ["system-config.ts"]),
+  assets = glob(["**/*.html"]) + [":dev_app_scss", ":theme"],
+  deps = [
+    "@angular//packages/common",
+    "@angular//packages/common/http",
+    "@angular//packages/core",
+    "@angular//packages/elements",
+    "@angular//packages/forms",
+    "@angular//packages/platform-browser",
+    "@angular//packages/platform-browser-dynamic",
+    "@angular//packages/platform-browser/animations",
+    "@angular//packages/router",
+    "@rxjs",
+    "@rxjs//operators",
+    "//src/cdk-experimental",
+    "//src/material-examples:examples",
+  ] + CDK_TARGETS + MATERIAL_TARGETS
+)
+
+sass_binary(
+  name = "theme",
+  src = "theme.scss",
+  deps = [
+    "//src/lib/core:all_themes"
+  ]
+)

src/dev-app/ripple/ripple-demo.scss

@@ -1,5 +1,3 @@
-@import '../../lib/core/style/vendor-prefixes';
-
 .demo-ripple {
   button, a {
     margin: 8px;

tools/sass_generate_binaries.bzl

@@ -3,11 +3,12 @@ load("@io_bazel_rules_sass//:defs.bzl", "sass_binary")
 # Generates multiple sass binaries based on a specified list of source files.
 # All generated sass binaries will be exposed as a filegroup that has all the
 # CSS outputs from the specified source files.
-def sass_generate_binaries(filegroup_name, source_files):
+def sass_generate_binaries(filegroup_name, source_files, sass_deps = []):
   for source_file in source_files:
     sass_binary(
       name = source_file.replace('.scss', '_scss'),
       src = source_file,
+      deps = sass_deps,
     )
 
   native.filegroup(