diff --git a/.bazelrc b/.bazelrc
index f81f732702..179a44ddd5 100644
--- a/.bazelrc
+++ b/.bazelrc
@@ -5,8 +5,8 @@ import %workspace%/common.bazelrc
# This lets us glob() up all the files inside the examples to make them inputs to tests
# To update these lines, just run `yarn bazel:update-deleted-packages`
# (Note, we cannot use common --deleted_packages because the bazel version command doesn't support it)
-build --deleted_packages=examples/angular,examples/angular/e2e,examples/angular/src/app/hello-world,examples/angular/src/app/todos/reducers,examples/angular/src/app/todos,examples/angular/src/app/home,examples/angular/src/app,examples/angular/src/shared/material,examples/angular/src/assets,examples/angular/src/example,examples/angular/src,examples/angular/src/lib/shorten,examples/angular/tools,examples/app,examples/app/styles,examples/app/test,examples/closure,examples/kotlin,examples/nestjs,examples/nestjs/src,examples/parcel,examples/protocol_buffers,examples/user_managed_deps,examples/vendored_node_and_yarn,examples/vendored_node,examples/webapp,examples/web_testing,examples/worker,e2e/bazel_managed_deps,e2e/fine_grained_symlinks,e2e/jasmine,e2e/karma,e2e/karma_stack_trace,e2e/karma_stack_trace/test_folder,e2e/karma_typescript,e2e/node_loader_no_preserve_symlinks,e2e/node_loader_preserve_symlinks,e2e/packages,e2e/symlinked_node_modules_npm,e2e/symlinked_node_modules_yarn,e2e/ts_auto_deps,e2e/ts_devserver,e2e/ts_devserver/genrule,e2e/ts_devserver/subpackage,e2e/typescript,e2e/webapp,e2e/webpack
-query --deleted_packages=examples/angular,examples/angular/e2e,examples/angular/src/app/hello-world,examples/angular/src/app/todos/reducers,examples/angular/src/app/todos,examples/angular/src/app/home,examples/angular/src/app,examples/angular/src/shared/material,examples/angular/src/assets,examples/angular/src/example,examples/angular/src,examples/angular/src/lib/shorten,examples/angular/tools,examples/app,examples/app/styles,examples/app/test,examples/closure,examples/kotlin,examples/nestjs,examples/nestjs/src,examples/parcel,examples/protocol_buffers,examples/user_managed_deps,examples/vendored_node_and_yarn,examples/vendored_node,examples/webapp,examples/web_testing,examples/worker,e2e/bazel_managed_deps,e2e/fine_grained_symlinks,e2e/jasmine,e2e/karma,e2e/karma_stack_trace,e2e/karma_stack_trace/test_folder,e2e/karma_typescript,e2e/node_loader_no_preserve_symlinks,e2e/node_loader_preserve_symlinks,e2e/packages,e2e/symlinked_node_modules_npm,e2e/symlinked_node_modules_yarn,e2e/ts_auto_deps,e2e/ts_devserver,e2e/ts_devserver/genrule,e2e/ts_devserver/subpackage,e2e/typescript,e2e/webapp,e2e/webpack
+build --deleted_packages=examples/angular,examples/angular/e2e,examples/angular/src/app/hello-world,examples/angular/src/app/todos/reducers,examples/angular/src/app/todos,examples/angular/src/app/home,examples/angular/src/app,examples/angular/src/shared/material,examples/angular/src/assets,examples/angular/src/example,examples/angular/src,examples/angular/src/lib/shorten,examples/angular/tools,examples/angular_view_engine,examples/angular_view_engine/e2e,examples/angular_view_engine/src/app/hello-world,examples/angular_view_engine/src/app/todos/reducers,examples/angular_view_engine/src/app/todos,examples/angular_view_engine/src/app/home,examples/angular_view_engine/src/app,examples/angular_view_engine/src/shared/material,examples/angular_view_engine/src/assets,examples/angular_view_engine/src/example,examples/angular_view_engine/src,examples/angular_view_engine/src/lib/shorten,examples/angular_view_engine/tools,examples/app,examples/app/styles,examples/app/test,examples/closure,examples/kotlin,examples/nestjs,examples/nestjs/src,examples/parcel,examples/protocol_buffers,examples/user_managed_deps,examples/vendored_node_and_yarn,examples/vendored_node,examples/webapp,examples/web_testing,examples/worker,e2e/bazel_managed_deps,e2e/fine_grained_symlinks,e2e/jasmine,e2e/karma,e2e/karma_stack_trace,e2e/karma_stack_trace/test_folder,e2e/karma_typescript,e2e/node_loader_no_preserve_symlinks,e2e/node_loader_preserve_symlinks,e2e/packages,e2e/symlinked_node_modules_npm,e2e/symlinked_node_modules_yarn,e2e/ts_auto_deps,e2e/ts_devserver,e2e/ts_devserver/genrule,e2e/ts_devserver/subpackage,e2e/typescript,e2e/webapp,e2e/webpack
+query --deleted_packages=examples/angular,examples/angular/e2e,examples/angular/src/app/hello-world,examples/angular/src/app/todos/reducers,examples/angular/src/app/todos,examples/angular/src/app/home,examples/angular/src/app,examples/angular/src/shared/material,examples/angular/src/assets,examples/angular/src/example,examples/angular/src,examples/angular/src/lib/shorten,examples/angular/tools,examples/angular_view_engine,examples/angular_view_engine/e2e,examples/angular_view_engine/src/app/hello-world,examples/angular_view_engine/src/app/todos/reducers,examples/angular_view_engine/src/app/todos,examples/angular_view_engine/src/app/home,examples/angular_view_engine/src/app,examples/angular_view_engine/src/shared/material,examples/angular_view_engine/src/assets,examples/angular_view_engine/src/example,examples/angular_view_engine/src,examples/angular_view_engine/src/lib/shorten,examples/angular_view_engine/tools,examples/app,examples/app/styles,examples/app/test,examples/closure,examples/kotlin,examples/nestjs,examples/nestjs/src,examples/parcel,examples/protocol_buffers,examples/user_managed_deps,examples/vendored_node_and_yarn,examples/vendored_node,examples/webapp,examples/web_testing,examples/worker,e2e/bazel_managed_deps,e2e/fine_grained_symlinks,e2e/jasmine,e2e/karma,e2e/karma_stack_trace,e2e/karma_stack_trace/test_folder,e2e/karma_typescript,e2e/node_loader_no_preserve_symlinks,e2e/node_loader_preserve_symlinks,e2e/packages,e2e/symlinked_node_modules_npm,e2e/symlinked_node_modules_yarn,e2e/ts_auto_deps,e2e/ts_devserver,e2e/ts_devserver/genrule,e2e/ts_devserver/subpackage,e2e/typescript,e2e/webapp,e2e/webpack
# Mock versioning command to test the --stamp behavior
build --workspace_status_command="echo BUILD_SCM_VERSION 1.2.3"
diff --git a/examples/BUILD.bazel b/examples/BUILD.bazel
index 5565201aed..5125161a4e 100644
--- a/examples/BUILD.bazel
+++ b/examples/BUILD.bazel
@@ -47,6 +47,39 @@ example_integration_test(
],
)
+example_integration_test(
+ name = "examples_angular_view_engine",
+ timeout = "long",
+ npm_packages = {
+ "//packages/karma:npm_package": "@bazel/karma",
+ "//packages/protractor:npm_package": "@bazel/protractor",
+ "//packages/rollup:npm_package": "@bazel/rollup",
+ "//packages/terser:npm_package": "@bazel/terser",
+ "//packages/typescript:npm_package": "@bazel/typescript",
+ },
+ tags = [
+ # bazel-in-bazel examples_angular_view_engine fails on ubuntu as the bazelci
+ # ubuntu docker image is missing shares libs required for the versions
+ # of chrome and firefox fetched by rules_webtesting. On circleci
+ # we have the same issue but we can work around it using apt-get.
+ # on bazelci apt-get fails with permission denied and there is no sudo
+ # command to switch to root.
+ # TODO(gregmagolan): figure out how to install the shared libs on bazelci
+ "no-bazelci-ubuntu",
+ # bazel-in-bazel examples_angular_view_engine fails on Windows on bazelci cloning a git repo:
+ # ```
+ # ERROR: no such package '@io_bazel_rules_k8s//k8s': Traceback (most recent call last):
+ # File "D:/b/ftxm343s/execroot/build_bazel_rules_nodejs/_tmp/3726d3573001cb4068a18af89eb255de/_bazel_b/ktluxf26/external/bazel_tools/tools/build_defs/repo/git.bzl", line 163
+ # _clone_or_update(ctx)
+ # File "D:/b/ftxm343s/execroot/build_bazel_rules_nodejs/_tmp/3726d3573001cb4068a18af89eb255de/_bazel_b/ktluxf26/external/bazel_tools/tools/build_defs/repo/git.bzl", line 36, in _clone_or_update
+ # git_repo(ctx, directory)
+ # ```
+ # This is most likely due to a memory issue with this large bazel-in-bazel test.
+ # TODO(gregmagolan): figure out what is broken with the above
+ "no-bazelci-windows",
+ ],
+)
+
example_integration_test(
name = "examples_app",
npm_packages = {
diff --git a/examples/angular_view_engine/.bazelrc b/examples/angular_view_engine/.bazelrc
new file mode 100644
index 0000000000..3431057af6
--- /dev/null
+++ b/examples/angular_view_engine/.bazelrc
@@ -0,0 +1 @@
+import %workspace%/../../common.bazelrc
diff --git a/examples/angular_view_engine/BUILD.bazel b/examples/angular_view_engine/BUILD.bazel
new file mode 100644
index 0000000000..52b971f1e9
--- /dev/null
+++ b/examples/angular_view_engine/BUILD.bazel
@@ -0,0 +1,9 @@
+package(default_visibility = ["//:__subpackages__"])
+
+# ts_library and ng_module use the `//:tsconfig.json` target
+# by default. This alias allows omitting explicit tsconfig
+# attribute.
+alias(
+ name = "tsconfig.json",
+ actual = "//src:tsconfig.json",
+)
diff --git a/examples/angular_view_engine/README.md b/examples/angular_view_engine/README.md
new file mode 100644
index 0000000000..be5b62fb1d
--- /dev/null
+++ b/examples/angular_view_engine/README.md
@@ -0,0 +1,5 @@
+# Example Angular application using Bazel
+
+**This is experimental, as part of Angular Labs! There may be breaking changes.**
+
+This is a ViewEngine version of the Angular example at /examples/angular
\ No newline at end of file
diff --git a/examples/angular_view_engine/WORKSPACE b/examples/angular_view_engine/WORKSPACE
new file mode 100644
index 0000000000..8460aee11b
--- /dev/null
+++ b/examples/angular_view_engine/WORKSPACE
@@ -0,0 +1,102 @@
+# The WORKSPACE file tells Bazel that this directory is a "workspace", which is like a project root.
+# The content of this file specifies all the external dependencies Bazel needs to perform a build.
+
+####################################
+# ESModule imports (and TypeScript imports) can be absolute starting with the workspace name.
+# The name of the workspace should match the npm package where we publish, so that these
+# imports also make sense when referencing the published package.
+workspace(
+ name = "examples_angular_view_engine",
+ managed_directories = {"@npm": ["node_modules"]},
+)
+
+# These rules are built-into Bazel but we need to load them first to download more rules
+load("@bazel_tools//tools/build_defs/repo:http.bzl", "http_archive")
+
+# Fetch rules_nodejs so we can install our npm dependencies
+http_archive(
+ name = "build_bazel_rules_nodejs",
+ sha256 = "1447312c8570e8916da0f5f415186e7098cdd4ce48e04b8e864f793c766959c3",
+ urls = ["https://github.com/bazelbuild/rules_nodejs/releases/download/0.38.2/rules_nodejs-0.38.2.tar.gz"],
+)
+
+# Fetch sass rules for compiling sass files
+http_archive(
+ name = "io_bazel_rules_sass",
+ sha256 = "4f05239080175a3f4efa8982d2b7775892d656bb47e8cf56914d5f9441fb5ea6",
+ strip_prefix = "rules_sass-86ca977cf2a8ed481859f83a286e164d07335116",
+ url = "https://github.com/bazelbuild/rules_sass/archive/86ca977cf2a8ed481859f83a286e164d07335116.zip",
+)
+
+# Check the bazel version and download npm dependencies
+load("@build_bazel_rules_nodejs//:index.bzl", "check_bazel_version", "yarn_install")
+
+# Bazel version must be at least the following version because:
+# - 0.27.0 Adds managed directories support
+check_bazel_version(
+ message = """
+You no longer need to install Bazel on your machine.
+Angular has a dependency on the @bazel/bazel package which supplies it.
+Try running `yarn bazel` instead.
+ (If you did run that, check that you've got a fresh `yarn install`)
+
+""",
+ minimum_bazel_version = "0.27.0",
+)
+
+# Setup the Node.js toolchain & install our npm dependencies into @npm
+yarn_install(
+ name = "npm",
+ package_json = "//:package.json",
+ yarn_lock = "//:yarn.lock",
+)
+
+# Install all bazel dependencies of our npm packages
+load("@npm//:install_bazel_dependencies.bzl", "install_bazel_dependencies")
+
+install_bazel_dependencies()
+
+# Load npm_bazel_protractor dependencies
+load("@npm_bazel_protractor//:package.bzl", "npm_bazel_protractor_dependencies")
+
+npm_bazel_protractor_dependencies()
+
+# Load npm_bazel_karma dependencies
+load("@npm_bazel_karma//:package.bzl", "npm_bazel_karma_dependencies")
+
+npm_bazel_karma_dependencies()
+
+# Setup the rules_webtesting toolchain
+load("@io_bazel_rules_webtesting//web:repositories.bzl", "web_test_repositories")
+
+web_test_repositories()
+
+load("@io_bazel_rules_webtesting//web/versioned:browsers-0.3.2.bzl", "browser_repositories")
+
+browser_repositories(
+ chromium = True,
+ firefox = True,
+)
+
+# Setup the rules_typescript tooolchain
+load("@npm_bazel_typescript//:index.bzl", "ts_setup_workspace")
+
+ts_setup_workspace()
+
+# Setup the rules_sass toolchain
+load("@io_bazel_rules_sass//sass:sass_repositories.bzl", "sass_repositories")
+
+sass_repositories()
+
+################################
+# Support for Remote Execution #
+################################
+
+http_archive(
+ name = "bazel_toolchains",
+ sha256 = "88e818f9f03628eef609c8429c210ecf265ffe46c2af095f36c7ef8b1855fef5",
+ strip_prefix = "bazel-toolchains-92dd8a7",
+ urls = [
+ "https://github.com/bazelbuild/bazel-toolchains/archive/92dd8a7.zip",
+ ],
+)
diff --git a/examples/angular_view_engine/angular-metadata.tsconfig.json b/examples/angular_view_engine/angular-metadata.tsconfig.json
new file mode 100644
index 0000000000..ff7d0b2f15
--- /dev/null
+++ b/examples/angular_view_engine/angular-metadata.tsconfig.json
@@ -0,0 +1,39 @@
+// WORKAROUND https://github.com/angular/angular/issues/18810
+//
+// This file is required to run ngc on 3rd party libraries such as @ngrx,
+// to write files like node_modules/@ngrx/store/store.ngsummary.json.
+//
+{
+ "compilerOptions": {
+ "lib": [
+ "dom",
+ "es2015"
+ ],
+ "experimentalDecorators": true,
+ "types": [],
+ "module": "amd",
+ "moduleResolution": "node"
+ },
+ "angularCompilerOptions": {
+ "enableSummariesForJit": true
+ },
+ "include": [
+ "node_modules/@angular/**/*",
+ "node_modules/@ngrx/**/*"
+ ],
+ "exclude": [
+ "node_modules/@ngrx/store/migrations/**",
+ "node_modules/@ngrx/store/schematics/**",
+ "node_modules/@ngrx/store/schematics-core/**",
+ "node_modules/@angular/cdk/schematics/**",
+ "node_modules/@angular/cdk/typings/schematics/**",
+ "node_modules/@angular/material/schematics/**",
+ "node_modules/@angular/material/typings/schematics/**",
+ "node_modules/@angular/common/upgrade*",
+ "node_modules/@angular/router/upgrade*",
+ "node_modules/@angular/bazel/**",
+ "node_modules/@angular/compiler-cli/**",
+ "node_modules/@angular/**/testing/**"
+
+ ]
+}
diff --git a/examples/angular_view_engine/angular.json b/examples/angular_view_engine/angular.json
new file mode 100644
index 0000000000..1a5e244500
--- /dev/null
+++ b/examples/angular_view_engine/angular.json
@@ -0,0 +1,95 @@
+{
+ "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+ "version": 1,
+ "newProjectRoot": "projects",
+ "projects": {
+ "angular-bazel-example": {
+ "root": "",
+ "sourceRoot": "src",
+ "projectType": "application",
+ "prefix": "app",
+ "schematics": {
+ "@schematics/angular:component": {
+ "style": "scss"
+ }
+ },
+ "architect": {
+ "build": {
+ "builder": "@angular/bazel:build",
+ "options": {
+ "targetLabel": "//src:prodapp",
+ "bazelCommand": "build"
+ }
+ },
+ "serve": {
+ "builder": "@angular/bazel:build",
+ "options": {
+ "targetLabel": "//src:devserver",
+ "bazelCommand": "run",
+ "watch": true
+ },
+ "configurations": {
+ "production": {
+ "targetLabel": "//src:prodserver"
+ }
+ }
+ },
+ "extract-i18n": {
+ "builder": "@angular-devkit/build-angular:extract-i18n",
+ "options": {
+ "browserTarget": "ngbazel:build"
+ }
+ },
+ "test": {
+ "builder": "@angular/bazel:build",
+ "options": {
+ "bazelCommand": "test",
+ "targetLabel": "//src/app/..."
+ }
+ },
+ "lint": {
+ "builder": "@angular-devkit/build-angular:tslint",
+ "options": {
+ "tsConfig": [
+ "src/tsconfig.app.json",
+ "src/tsconfig.spec.json"
+ ],
+ "exclude": [
+ "**/node_modules/**"
+ ]
+ }
+ }
+ }
+ },
+ "ngbazel-e2e": {
+ "root": "e2e/",
+ "projectType": "application",
+ "prefix": "",
+ "architect": {
+ "e2e": {
+ "builder": "@angular/bazel:build",
+ "options": {
+ "bazelCommand": "test",
+ "targetLabel": "//e2e:devserver_test"
+ },
+ "configurations": {
+ "production": {
+ "targetLabel": "//e2e:prodserver_test"
+ }
+ }
+ },
+ "lint": {
+ "builder": "@angular-devkit/build-angular:tslint",
+ "options": {
+ "tsConfig": "e2e/tsconfig.e2e.json",
+ "exclude": [
+ "**/node_modules/**"
+ ]
+ }
+ }
+ }
+ }
+ },
+ "defaultProject": "ngbazel"
+
+}
\ No newline at end of file
diff --git a/examples/angular_view_engine/e2e/BUILD.bazel b/examples/angular_view_engine/e2e/BUILD.bazel
new file mode 100644
index 0000000000..ca4f9c19df
--- /dev/null
+++ b/examples/angular_view_engine/e2e/BUILD.bazel
@@ -0,0 +1,28 @@
+load("@npm_bazel_protractor//:index.bzl", "protractor_web_test_suite")
+load("@npm_bazel_typescript//:index.bzl", "ts_library")
+
+ts_library(
+ name = "e2e",
+ testonly = 1,
+ srcs = glob(["src/*.ts"]),
+ tsconfig = "//src:tsconfig-test",
+ deps = [
+ "@npm//@types/jasmine",
+ "@npm//jasmine",
+ "@npm//protractor",
+ ],
+)
+
+protractor_web_test_suite(
+ name = "prodserver_test",
+ on_prepare = ":protractor.on-prepare.js",
+ server = "//src:prodserver",
+ deps = [":e2e"],
+)
+
+protractor_web_test_suite(
+ name = "devserver_test",
+ on_prepare = ":protractor.on-prepare.js",
+ server = "//src:devserver",
+ deps = [":e2e"],
+)
diff --git a/examples/angular_view_engine/e2e/protractor.on-prepare.js b/examples/angular_view_engine/e2e/protractor.on-prepare.js
new file mode 100644
index 0000000000..813592154c
--- /dev/null
+++ b/examples/angular_view_engine/e2e/protractor.on-prepare.js
@@ -0,0 +1,26 @@
+// The function exported from this file is used by the protractor_web_test_suite.
+// It is passed to the `onPrepare` configuration setting in protractor and executed
+// before running tests.
+//
+// If the function returns a promise, as it does here, protractor will wait
+// for the promise to resolve before running tests.
+
+const protractorUtils = require('@bazel/protractor/protractor-utils');
+const protractor = require('protractor');
+const path = require('path');
+
+module.exports = function(config) {
+ // In this example, `@bazel/protractor/protractor-utils` is used to run
+ // the server. protractorUtils.runServer() runs the server on a randomly
+ // selected port (given a port flag to pass to the server as an argument).
+ // The port used is returned in serverSpec and the protractor serverUrl
+ // is the configured.
+ const isProdserver = path.basename(config.server, path.extname(config.server)) === 'prodserver';
+ return protractorUtils
+ .runServer(config.workspace, config.server, isProdserver ? '-p' : '-port', [])
+ .then(serverSpec => {
+ // Example app is hosted under `/example` in the prodserver and under `/` in devserver
+ const serverUrl = `http://localhost:${serverSpec.port}` + (isProdserver ? '/example' : '');
+ protractor.browser.baseUrl = serverUrl;
+ });
+};
diff --git a/examples/angular_view_engine/e2e/src/app.e2e-spec.ts b/examples/angular_view_engine/e2e/src/app.e2e-spec.ts
new file mode 100644
index 0000000000..3de22628e0
--- /dev/null
+++ b/examples/angular_view_engine/e2e/src/app.e2e-spec.ts
@@ -0,0 +1,16 @@
+import {AppPage} from './app.po';
+
+describe('angular example application', () => {
+ let page: AppPage;
+
+ beforeEach(() => {
+ page = new AppPage();
+ });
+
+ it('should display: Hello World!', async () => {
+ await page.navigateTo();
+ expect(await page.getParagraphText()).toEqual(`Hello Adolph Blain...`);
+ await page.typeInInput('!');
+ expect(await page.getParagraphText()).toEqual(`Hello Adolph Blain...!`);
+ });
+});
diff --git a/examples/angular_view_engine/e2e/src/app.po.ts b/examples/angular_view_engine/e2e/src/app.po.ts
new file mode 100644
index 0000000000..73033fc89a
--- /dev/null
+++ b/examples/angular_view_engine/e2e/src/app.po.ts
@@ -0,0 +1,22 @@
+import {browser, by, element} from 'protractor';
+
+export class AppPage {
+ async navigateTo() {
+ await browser.get(browser.baseUrl + '/hello');
+ return browser.waitForAngular();
+ }
+
+ async waitForElement(el, timeout = 10000) {
+ await browser.wait(() => el.isPresent(), timeout);
+ await browser.wait(() => el.isDisplayed(), timeout);
+ return el;
+ }
+
+ async getParagraphText() {
+ return (await this.waitForElement(element(by.css('div#greeting')))).getText();
+ }
+
+ async typeInInput(s: string) {
+ return (await this.waitForElement(element(by.css('input')))).sendKeys(s);
+ }
+}
diff --git a/examples/angular_view_engine/package.json b/examples/angular_view_engine/package.json
new file mode 100644
index 0000000000..3a201ee973
--- /dev/null
+++ b/examples/angular_view_engine/package.json
@@ -0,0 +1,70 @@
+{
+ "name": "angular-bazel-example",
+ "private": true,
+ "description": "Demo of building Angular apps with Bazel",
+ "license": "Apache-2.0",
+ "engines": {
+ "node": ">=10.9.0 <11.0.0",
+ "yarn": ">=1.9.2 <2.0.0"
+ },
+ "dependencies": {
+ "@angular/animations": "8.2.9",
+ "@angular/cdk": "8.2.3",
+ "@angular/common": "8.2.9",
+ "@angular/core": "8.2.9",
+ "@angular/forms": "8.2.9",
+ "@angular/material": "8.2.3",
+ "@angular/platform-browser": "8.2.9",
+ "@angular/platform-browser-dynamic": "8.2.9",
+ "@angular/router": "8.2.9",
+ "@ngrx/store": "8.3.0",
+ "date-fns": "1.30.1",
+ "rxjs": "6.5.3",
+ "systemjs": "6.1.2",
+ "tslib": "1.10.0",
+ "zone.js": "0.10.2"
+ },
+ "devDependencies": {
+ "@angular/bazel": "9.0.0-next.8",
+ "@angular/cli": "8.3.8",
+ "@angular/compiler": "8.2.9",
+ "@angular/compiler-cli": "8.2.9",
+ "@babel/cli": "^7.6.0",
+ "@babel/core": "^7.6.0",
+ "@babel/preset-env": "^7.6.0",
+ "@bazel/bazel": "^0.29.0",
+ "@bazel/benchmark-runner": "0.1.0",
+ "@bazel/buildifier": "0.28.0",
+ "@bazel/ibazel": "0.10.3",
+ "@bazel/karma": "^0.38.0",
+ "@bazel/protractor": "^0.38.0",
+ "@bazel/rollup": "^0.38.0",
+ "@bazel/terser": "^0.38.0",
+ "@bazel/typescript": "^0.38.0",
+ "@types/jasmine": "3.4.0",
+ "@types/node": "6.14.6",
+ "core-js": "2.6.9",
+ "firebase-tools": "7.1.0",
+ "history-server": "^1.3.1",
+ "patch-package": "^6.2.0",
+ "rollup": "^1.21.4",
+ "rollup-plugin-amd": "^4.0.0",
+ "rollup-plugin-commonjs": "^10.1.0",
+ "rollup-plugin-node-resolve": "^5.2.0",
+ "rollup-plugin-re": "^1.0.7",
+ "terser": "4.3.1",
+ "typescript": "3.4.5"
+ },
+ "scripts": {
+ "build": "bazel build //src:bundle",
+ "serve": "ibazel run //src:devserver",
+ "deploy": "ng build && firebase deploy",
+ "serve-prod": "bazel run //src:prodserver",
+ "e2e": "bazel test //e2e:all",
+ "test": "bazel test //src/...",
+ "benchmark": "ibazel-benchmark-runner //src:devserver src/app/hello-world/hello-world.component.ts --url=http://localhost:5432",
+ "postinstall": "patch-package && ngc -p angular-metadata.tsconfig.json",
+ "generate": "node tools/generator/index.js",
+ "generate:clean": "node tools/generator/index.js --clean"
+ }
+}
diff --git a/examples/angular_view_engine/patches/@angular+bazel+9.0.0-next.8.patch b/examples/angular_view_engine/patches/@angular+bazel+9.0.0-next.8.patch
new file mode 100644
index 0000000000..6e275a72d7
--- /dev/null
+++ b/examples/angular_view_engine/patches/@angular+bazel+9.0.0-next.8.patch
@@ -0,0 +1,172 @@
+diff --git a/node_modules/@angular/bazel/src/external.bzl b/node_modules/@angular/bazel/src/external.bzl
+index 4959f22..43f1c96 100755
+--- a/node_modules/@angular/bazel/src/external.bzl
++++ b/node_modules/@angular/bazel/src/external.bzl
+@@ -14,17 +14,17 @@ load(
+ _ts_providers_dict_to_struct = "ts_providers_dict_to_struct",
+ )
+ load(
+- "@build_bazel_rules_nodejs//internal/common:node_module_info.bzl",
+- _NodeModuleSources = "NodeModuleSources",
+- _collect_node_modules_aspect = "collect_node_modules_aspect",
++ "@build_bazel_rules_nodejs//internal/common:npm_package_info.bzl",
++ _NpmPackageInfo = "NpmPackageInfo",
++ _node_modules_aspect = "node_modules_aspect",
+ )
+ load(
+ "@npm_bazel_typescript//internal:ts_config.bzl",
+ _TsConfigInfo = "TsConfigInfo",
+ )
+
+-NodeModuleSources = _NodeModuleSources
+-collect_node_modules_aspect = _collect_node_modules_aspect
++NpmPackageInfo = _NpmPackageInfo
++node_modules_aspect = _node_modules_aspect
+
+ tsc_wrapped_tsconfig = _tsc_wrapped_tsconfig
+ COMMON_ATTRIBUTES = _COMMON_ATTRIBUTES
+diff --git a/node_modules/@angular/bazel/src/modify_tsconfig.js b/node_modules/@angular/bazel/src/modify_tsconfig.js
+index 9d3c491..3c99746 100755
+--- a/node_modules/@angular/bazel/src/modify_tsconfig.js
++++ b/node_modules/@angular/bazel/src/modify_tsconfig.js
+@@ -44,7 +44,7 @@ function main(args) {
+ // ngc-wrapped is expecting POSIX paths and the TypeScript Bazel rules by default only pass
+ // POSIX paths as well.
+ angularCompilerOptions['expectedOut'] = angularCompilerOptions['expectedOut'].map(
+- f => f.replace(/\.closure\.js$/, '.js').replace(binDir, newOutputBase));
++ f => f.replace(/\.mjs$/, '.js').replace(binDir, newOutputBase));
+ }
+ fs.writeFileSync(output, JSON.stringify(data));
+ }
+diff --git a/node_modules/@angular/bazel/src/ng_module.bzl b/node_modules/@angular/bazel/src/ng_module.bzl
+index 9b88fbb..54bf2c7 100755
+--- a/node_modules/@angular/bazel/src/ng_module.bzl
++++ b/node_modules/@angular/bazel/src/ng_module.bzl
+@@ -13,13 +13,14 @@ load(
+ "DEFAULT_NG_COMPILER",
+ "DEFAULT_NG_XI18N",
+ "DEPS_ASPECTS",
+- "NodeModuleSources",
++ "NpmPackageInfo",
+ "TsConfigInfo",
+- "collect_node_modules_aspect",
++ "node_modules_aspect",
+ "compile_ts",
+ "ts_providers_dict_to_struct",
+ "tsc_wrapped_tsconfig",
+ )
++load("@build_bazel_rules_nodejs//:providers.bzl", "js_ecma_script_module_info", "js_named_module_info")
+
+ _FLAT_DTS_FILE_SUFFIX = ".bundle.d.ts"
+ _R3_SYMBOLS_DTS_FILE = "src/r3_symbols.d.ts"
+@@ -237,7 +238,7 @@ def _expected_outs(ctx):
+ continue
+
+ filter_summaries = ctx.attr.filter_summaries
+- closure_js = [f.replace(".js", ".closure.js") for f in devmode_js if not filter_summaries or not f.endswith(".ngsummary.js")]
++ closure_js = [f.replace(".js", ".mjs") for f in devmode_js if not filter_summaries or not f.endswith(".ngsummary.js")]
+ declarations = [f.replace(".js", ".d.ts") for f in devmode_js]
+
+ devmode_js_files += [ctx.actions.declare_file(basename + ext) for ext in devmode_js]
+@@ -262,7 +263,7 @@ def _expected_outs(ctx):
+ if _should_produce_flat_module_outs(ctx):
+ flat_module_out = _flat_module_out_file(ctx)
+ devmode_js_files.append(ctx.actions.declare_file("%s.js" % flat_module_out))
+- closure_js_files.append(ctx.actions.declare_file("%s.closure.js" % flat_module_out))
++ closure_js_files.append(ctx.actions.declare_file("%s.mjs" % flat_module_out))
+ bundle_index_typings = ctx.actions.declare_file("%s.d.ts" % flat_module_out)
+ declaration_files.append(bundle_index_typings)
+ if is_legacy_ngc:
+@@ -517,11 +518,11 @@ def _compile_action(ctx, inputs, outputs, dts_bundles_out, messages_out, tsconfi
+ file_inputs += ctx.attr.tsconfig[TsConfigInfo].deps
+
+ # Also include files from npm fine grained deps as action_inputs.
+- # These deps are identified by the NodeModuleSources provider.
++ # These deps are identified by the NpmPackageInfo provider.
+ for d in ctx.attr.deps:
+- if NodeModuleSources in d:
++ if NpmPackageInfo in d:
+ # Note: we can't avoid calling .to_list() on sources
+- file_inputs.extend(_filter_ts_inputs(d[NodeModuleSources].sources.to_list()))
++ file_inputs.extend(_filter_ts_inputs(d[NpmPackageInfo].sources.to_list()))
+
+ # Collect the inputs and summary files from our deps
+ action_inputs = depset(
+@@ -603,9 +604,23 @@ def ng_module_impl(ctx, ts_compile_actions):
+ return providers
+
+ def _ng_module_impl(ctx):
+- return ts_providers_dict_to_struct(ng_module_impl(ctx, compile_ts))
+-
+-local_deps_aspects = [collect_node_modules_aspect, _collect_summaries_aspect]
++ ts_providers = ng_module_impl(ctx, compile_ts)
++
++ # Add in new JS providers
++ ts_providers["providers"].extend([
++ js_named_module_info(
++ sources = ts_providers["typescript"]["es5_sources"],
++ deps = ctx.attr.deps,
++ ),
++ js_ecma_script_module_info(
++ sources = ts_providers["typescript"]["es6_sources"],
++ deps = ctx.attr.deps,
++ ),
++ ])
++
++ return ts_providers_dict_to_struct(ts_providers)
++
++local_deps_aspects = [node_modules_aspect, _collect_summaries_aspect]
+
+ # Workaround skydoc bug which assumes DEPS_ASPECTS is a str type
+ [local_deps_aspects.append(a) for a in DEPS_ASPECTS]
+diff --git a/node_modules/@angular/bazel/src/ng_package/ng_package.bzl b/node_modules/@angular/bazel/src/ng_package/ng_package.bzl
+index 48d7619..ea635bb 100755
+--- a/node_modules/@angular/bazel/src/ng_package/ng_package.bzl
++++ b/node_modules/@angular/bazel/src/ng_package/ng_package.bzl
+@@ -13,9 +13,8 @@ It packages your library following the Angular Package Format, see the
+ specification of this format at https://goo.gl/jB3GVv
+ """
+
+-load("@build_bazel_rules_nodejs//internal/common:collect_es6_sources.bzl", "collect_es6_sources")
+-load("@build_bazel_rules_nodejs//internal/common:node_module_info.bzl", "NodeModuleSources")
+-load("@build_bazel_rules_nodejs//internal/common:sources_aspect.bzl", "sources_aspect")
++load("@build_bazel_rules_nodejs//:providers.bzl", "JSEcmaScriptModuleInfo", "JSNamedModuleInfo")
++load("@build_bazel_rules_nodejs//internal/common:npm_package_info.bzl", "NpmPackageInfo")
+ load(
+ "@build_bazel_rules_nodejs//internal/rollup:rollup_bundle.bzl",
+ "ROLLUP_ATTRS",
+@@ -207,7 +206,12 @@ def _filter_js_inputs(all_inputs):
+ def _ng_package_impl(ctx):
+ npm_package_directory = ctx.actions.declare_directory("%s.ng_pkg" % ctx.label.name)
+
+- esm_2015_files = _filter_out_generated_files(collect_es6_sources(ctx), "js")
++ esm_2015_files = []
++ for dep in ctx.attr.deps:
++ if JSEcmaScriptModuleInfo in dep:
++ esm_2015_files += dep[JSEcmaScriptModuleInfo].sources.to_list()
++
++ esm_2015_files = _filter_out_generated_files(esm_2015_files, "js")
+ esm5_sources = _filter_out_generated_files(flatten_esm5(ctx), "js")
+
+ # These accumulators match the directory names where the files live in the
+@@ -347,9 +351,9 @@ def _ng_package_impl(ctx):
+ node_modules_files = _filter_js_inputs(ctx.files.node_modules)
+
+ # Also include files from npm fine grained deps as inputs.
+- # These deps are identified by the NodeModuleSources provider.
++ # These deps are identified by the NpmPackageInfo provider.
+ for d in ctx.attr.deps:
+- if NodeModuleSources in d:
++ if NpmPackageInfo in d:
+ node_modules_files += _filter_js_inputs(d.files)
+ esm5_rollup_inputs = depset(node_modules_files, transitive = [esm5_sources])
+
+@@ -469,7 +473,7 @@ def _ng_package_impl(ctx):
+ files = depset([package_dir]),
+ )]
+
+-DEPS_ASPECTS = [esm5_outputs_aspect, sources_aspect]
++DEPS_ASPECTS = [esm5_outputs_aspect]
+
+ # Workaround skydoc bug which assumes ROLLUP_DEPS_ASPECTS is a str type
+ [DEPS_ASPECTS.append(a) for a in ROLLUP_DEPS_ASPECTS]
diff --git a/examples/angular_view_engine/patches/@buxlabs+amd-to-es6+0.13.3.patch b/examples/angular_view_engine/patches/@buxlabs+amd-to-es6+0.13.3.patch
new file mode 100644
index 0000000000..7e88d17d7e
--- /dev/null
+++ b/examples/angular_view_engine/patches/@buxlabs+amd-to-es6+0.13.3.patch
@@ -0,0 +1,13 @@
+diff --git a/node_modules/@buxlabs/amd-to-es6/src/lib/getImportDeclaration.js b/node_modules/@buxlabs/amd-to-es6/src/lib/getImportDeclaration.js
+index 1062a4d..280957f 100644
+--- a/node_modules/@buxlabs/amd-to-es6/src/lib/getImportDeclaration.js
++++ b/node_modules/@buxlabs/amd-to-es6/src/lib/getImportDeclaration.js
+@@ -11,7 +11,7 @@ module.exports = function (element, param) {
+ })
+ } else {
+ specifiers.push({
+- type: 'ImportDefaultSpecifier',
++ type: 'ImportNamespaceSpecifier',
+ local: {
+ type: 'Identifier',
+ name: param
diff --git a/examples/angular_view_engine/src/BUILD.bazel b/examples/angular_view_engine/src/BUILD.bazel
new file mode 100644
index 0000000000..5e850775fa
--- /dev/null
+++ b/examples/angular_view_engine/src/BUILD.bazel
@@ -0,0 +1,191 @@
+load("@build_bazel_rules_nodejs//internal/web_package:web_package.bzl", "web_package")
+load("@io_bazel_rules_sass//:defs.bzl", "sass_binary")
+load("@npm//@babel/cli:index.bzl", "babel")
+load("@npm//history-server:index.bzl", "history_server")
+load("@npm_angular_bazel//:index.bzl", "ng_module")
+load("@npm_bazel_rollup//:index.bzl", "rollup_bundle")
+load("@npm_bazel_terser//:index.bzl", "terser_minified")
+load("@npm_bazel_typescript//:index.bzl", "ts_config", "ts_devserver", "ts_library")
+
+package(default_visibility = ["//:__subpackages__"])
+
+ts_config(
+ name = "tsconfig-test",
+ src = "tsconfig-test.json",
+ deps = [":tsconfig.json"],
+)
+
+# Run the sass compiler to output "styles.css"
+# TODO(alexeagle): demonstrate the sass_library rule too
+sass_binary(
+ name = "styles",
+ src = "styles.scss",
+)
+
+# We don't import from these, but the generated ngfactory code will
+NG_FACTORY_ADDED_IMPORTS = [
+ "@npm//@angular/animations",
+ "@npm//@angular/cdk",
+ "@npm//@angular/material",
+ "@npm//@angular/forms",
+]
+
+ts_library(
+ name = "initialize_testbed",
+ testonly = 1,
+ srcs = [
+ "initialize_testbed.ts",
+ ],
+ deps = [
+ "@npm//@angular/core",
+ "@npm//@angular/platform-browser-dynamic",
+ "@npm//@types",
+ ],
+)
+
+ng_module(
+ name = "src",
+ srcs = [
+ "main.dev.ts",
+ "main.prod.ts",
+ ],
+ tsconfig = ":tsconfig.json",
+ deps = NG_FACTORY_ADDED_IMPORTS + [
+ "//src/app",
+ "@npm//@angular/core",
+ "@npm//@angular/platform-browser",
+ "@npm//@angular/router",
+ "@npm//@ngrx/store",
+ ],
+)
+
+filegroup(
+ name = "rxjs_umd_modules",
+ srcs = [
+ ":rxjs_shims.js",
+ "@npm//:node_modules/rxjs/bundles/rxjs.umd.js",
+ ],
+)
+
+# Files that we serve in both development and production
+_ASSETS = [
+ # This label references an output of the "styles" sass_binary above.
+ ":styles.css",
+
+ # Directly reference a file that came from @angular/material npm package
+ "@npm//:node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css",
+
+ # We load zone.js outside the bundle. That's because it's a "pollyfill"
+ # which speculates that such features might be available in a browser.
+ # Also it's tricky to configure dead code elimination to understand that
+ # zone.js is used, given that we don't have any import statement that
+ # imports from it.
+ "@npm//:node_modules/zone.js/dist/zone.min.js",
+]
+
+# This devserver is written in Go and is super-fast.
+# It doesn't run any bundler or code splitter. Instead, it concatenates
+# named UMD and named AMD JavaScript code on-the-fly in-memory.
+# This scales really well for massive codebases.
+ts_devserver(
+ name = "devserver",
+ # Serve these files but don't inject tags for them into the index file
+ # This might be because we only want to lazy-load these scripts on-demand,
+ # or because they aren't compatible with Require.js so we must use a runtime
+ # loader to load them.
+ data = [
+ "//src/assets",
+ ],
+ # Start from the development version of the main
+ entry_module = "angular_bazel_example/src/main.dev",
+ #
+
+
+
+
+
+