diff --git a/src/dev-app/BUILD.bazel b/src/dev-app/BUILD.bazel
index c5129df01e38..d091c473a483 100644
--- a/src/dev-app/BUILD.bazel
+++ b/src/dev-app/BUILD.bazel
@@ -1,6 +1,11 @@
package(default_visibility = ["//visibility:public"])
+load("//src/cdk:config.bzl", "CDK_ENTRYPOINTS")
+load("//src/cdk-experimental:config.bzl", "CDK_EXPERIMENTAL_ENTRYPOINTS")
+load("//src/material:config.bzl", "MATERIAL_ENTRYPOINTS")
+load("//src/material-experimental:config.bzl", "MATERIAL_EXPERIMENTAL_ENTRYPOINTS")
load("//tools:defaults.bzl", "ng_module", "sass_binary")
+load("//tools/bazel:expand_template.bzl", "expand_template")
load("//tools/dev-server:index.bzl", "dev_server")
ng_module(
@@ -92,10 +97,17 @@ sass_binary(
],
)
-genrule(
- name = "setup_compile_mode_script",
- outs = ["setup_compile_mode.js"],
- cmd = "echo window.bazelCompileMode = \"'$(compile)'\"\; > $@",
+expand_template(
+ name = "system-config",
+ configuration_env_vars = ["compile"],
+ output_name = "system-config.js",
+ substitutions = {
+ "$CDK_ENTRYPOINTS_TMPL": str(CDK_ENTRYPOINTS),
+ "$CDK_EXPERIMENTAL_ENTRYPOINTS_TMPL": str(CDK_EXPERIMENTAL_ENTRYPOINTS),
+ "$MATERIAL_ENTRYPOINTS_TMPL": str(MATERIAL_ENTRYPOINTS),
+ "$MATERIAL_EXPERIMENTAL_ENTRYPOINTS_TMPL": str(MATERIAL_EXPERIMENTAL_ENTRYPOINTS),
+ },
+ template = "system-config-tmpl.js",
)
dev_server(
@@ -103,9 +115,8 @@ dev_server(
srcs = [
"favicon.ico",
"index.html",
- "system-config.js",
"system-rxjs-operators.js",
- ":setup_compile_mode_script",
+ ":system-config",
":theme",
"//src/dev-app/icon:icon_demo_assets",
"@npm//:node_modules/@material/animation/dist/mdc.animation.js",
diff --git a/src/dev-app/index.html b/src/dev-app/index.html
index cec285a88864..2c4426c01d2d 100644
--- a/src/dev-app/index.html
+++ b/src/dev-app/index.html
@@ -28,7 +28,6 @@
-
diff --git a/src/dev-app/system-config.js b/src/dev-app/system-config-tmpl.js
similarity index 80%
rename from src/dev-app/system-config.js
rename to src/dev-app/system-config-tmpl.js
index 265a322eb557..271fda6d5e85 100644
--- a/src/dev-app/system-config.js
+++ b/src/dev-app/system-config-tmpl.js
@@ -6,70 +6,17 @@
* found in the LICENSE file at https://angular.io/license
*/
-// Note that this file isn't being transpiled so we need to keep it in ES5.
-
-var CDK_PACKAGES = [
- 'a11y',
- 'accordion',
- 'bidi',
- 'clipboard',
- 'coercion',
- 'collections',
- 'drag-drop',
- 'keycodes',
- 'layout',
- 'observers',
- 'overlay',
- 'platform',
- 'portal',
- 'scrolling',
- 'stepper',
- 'table',
- 'text-field',
- 'tree',
-];
-
-var CDK_EXPERIMENTAL_PACKAGES = [
- 'dialog',
- 'popover-edit',
- 'scrolling',
-];
-
-var MATERIAL_PACKAGES = [
- 'autocomplete', 'badge',
- 'bottom-sheet', 'button',
- 'button-toggle', 'card',
- 'checkbox', 'chips',
- 'core', 'datepicker',
- 'dialog', 'divider',
- 'expansion', 'form-field',
- 'grid-list', 'icon',
- 'input', 'list',
- 'menu', 'paginator',
- 'progress-bar', 'progress-spinner',
- 'radio', 'select',
- 'sidenav', 'slide-toggle',
- 'slider', 'snack-bar',
- 'sort', 'stepper',
- 'table', 'tabs',
- 'toolbar', 'tooltip',
- 'tree',
-];
-
-var MATERIAL_EXPERIMENTAL_PACKAGES = [
- 'mdc-button',
- 'mdc-card',
- 'mdc-checkbox',
- 'mdc-chips',
- 'mdc-tabs',
- 'mdc-helpers',
- 'mdc-menu',
- 'mdc-radio',
- 'mdc-progress-bar',
- 'mdc-slide-toggle',
- 'mdc-slider',
- 'popover-edit',
-];
+// Note that this file isn't being transpiled so we need to keep it in ES5. Also
+// identifiers of the format "$NAME_TMPL" will be replaced by the Bazel rule that
+// converts this template file into the actual SystemJS configuration file.
+
+var CDK_PACKAGES = $CDK_ENTRYPOINTS_TMPL;
+var CDK_EXPERIMENTAL_PACKAGES = $CDK_EXPERIMENTAL_ENTRYPOINTS_TMPL;
+var MATERIAL_PACKAGES = $MATERIAL_ENTRYPOINTS_TMPL;
+var MATERIAL_EXPERIMENTAL_PACKAGES = $MATERIAL_EXPERIMENTAL_ENTRYPOINTS_TMPL;
+
+/** Whether the dev-app is served with Ivy enabled. */
+var isRunningWithIvy = '$COMPILE_TMPL' === 'aot';
/** Bazel runfile path referring to the "src/" folder of the project. */
var srcRunfilePath = 'angular_material/src';
@@ -80,10 +27,7 @@ var pathMapping = {};
/** Package configurations that will be used in SystemJS. */
var packagesConfig = {};
-// The "bazelCompileMode" property will be set globally by the "setup-compile-mode.js"
-// script. This allows us to switch between Ivy and View Engine UMD bundles automatically.
-/** Whether the dev-app is served with Ivy enabled. */
-var isRunningWithIvy = window.bazelCompileMode === 'aot';
+
// Configure all primary entry-points.
configureEntryPoint('cdk');
diff --git a/tools/bazel/expand_template.bzl b/tools/bazel/expand_template.bzl
new file mode 100644
index 000000000000..78705b6cab03
--- /dev/null
+++ b/tools/bazel/expand_template.bzl
@@ -0,0 +1,28 @@
+"""Implementation of the expand_template rule """
+
+def expand_template_impl(ctx):
+ replacements = dict(**ctx.attr.substitutions)
+
+ for k in ctx.attr.configuration_env_vars:
+ if k in ctx.var.keys():
+ replacements["$%s_TMPL" % k.upper()] = ctx.var[k]
+
+ ctx.actions.expand_template(
+ template = ctx.file.template,
+ output = ctx.outputs.output_name,
+ substitutions = replacements,
+ )
+
+"""
+ Rule that can be used to output a file from a specified
+ template by applying given substitutions.
+"""
+expand_template = rule(
+ implementation = expand_template_impl,
+ attrs = {
+ "configuration_env_vars": attr.string_list(default = []),
+ "output_name": attr.output(mandatory = True),
+ "substitutions": attr.string_dict(mandatory = True),
+ "template": attr.label(mandatory = True, allow_single_file = True),
+ },
+)