Add a very basic angular example.
Also include a basic devserver: bazel run //scouting/wwww:devserver
Most of the code is boilerplate for the bootstrap process. app.ts and
app.ng.html are representative of "regular" components though.
app.module.ts is mostly representative, but has some special handling
for being the bootstrapped module/component.
Change-Id: I58b5424688d2e67e7ec2ba379bd84f2bf2160b06
Signed-off-by: Alex Perry <alex.perry96@gmail.com>
diff --git a/scouting/www/BUILD b/scouting/www/BUILD
new file mode 100644
index 0000000..88cadab
--- /dev/null
+++ b/scouting/www/BUILD
@@ -0,0 +1,57 @@
+load("@npm//@bazel/typescript:index.bzl", "ts_project")
+load("//tools/build_rules:js.bzl", "rollup_bundle")
+load("@npm//@bazel/concatjs:index.bzl", "concatjs_devserver")
+load("@npm//@babel/cli:index.bzl", "babel")
+
+ts_project(
+ name = "app",
+ srcs = glob([
+ "*.ts",
+ "*.ng.html",
+ ]),
+ tsc = "@npm//@angular/compiler-cli/bin:ngc",
+ tsconfig = "//:tsconfig.json",
+ visibility = ["//visibility:public"],
+ deps = [
+ "@npm//@angular/animations",
+ "@npm//@angular/common",
+ "@npm//@angular/compiler",
+ "@npm//@angular/core",
+ "@npm//@angular/platform-browser",
+ ],
+)
+
+rollup_bundle(
+ name = "main_bundle",
+ entry_point = "main.ts",
+ deps = [
+ "app",
+ ],
+)
+
+babel(
+ name = "main_bundle_compiled",
+ args = [
+ "$(execpath :main_bundle)",
+ "--no-babelrc",
+ "--source-maps",
+ "--plugins=@angular/compiler-cli/linker/babel",
+ "--out-dir",
+ "$(@D)",
+ ],
+ data = [
+ ":main_bundle",
+ "@npm//@angular/compiler-cli",
+ ],
+ output_dir = True,
+)
+
+concatjs_devserver(
+ name = "devserver",
+ serving_path = "/main_bundle.js",
+ static_files = [
+ ":index.html",
+ "@npm//:node_modules/zone.js/dist/zone.min.js",
+ ],
+ deps = [":main_bundle_compiled"],
+)
diff --git a/scouting/www/README.md b/scouting/www/README.md
new file mode 100644
index 0000000..f337ae5
--- /dev/null
+++ b/scouting/www/README.md
@@ -0,0 +1,4 @@
+Run using:
+bazel run //scouting/www:devserver
+
+Follow the instructions in the console to access locally.
diff --git a/scouting/www/app.ng.html b/scouting/www/app.ng.html
new file mode 100644
index 0000000..fb9ba26
--- /dev/null
+++ b/scouting/www/app.ng.html
@@ -0,0 +1,3 @@
+<h1>
+ This is an app.
+</h1>
diff --git a/scouting/www/app.ts b/scouting/www/app.ts
new file mode 100644
index 0000000..f6247d3
--- /dev/null
+++ b/scouting/www/app.ts
@@ -0,0 +1,8 @@
+import {Component} from '@angular/core';
+
+@Component({
+ selector: 'my-app',
+ templateUrl: './app.ng.html',
+})
+export class App {
+}
diff --git a/scouting/www/app_module.ts b/scouting/www/app_module.ts
new file mode 100644
index 0000000..3e34a17
--- /dev/null
+++ b/scouting/www/app_module.ts
@@ -0,0 +1,17 @@
+import {NgModule} from '@angular/core';
+import {BrowserModule} from '@angular/platform-browser';
+import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
+
+import {App} from './app';
+
+@NgModule({
+ declarations: [App],
+ imports: [
+ BrowserModule,
+ BrowserAnimationsModule,
+ ],
+ exports: [App],
+ bootstrap: [App],
+})
+export class AppModule {
+}
diff --git a/scouting/www/index.html b/scouting/www/index.html
new file mode 100644
index 0000000..cbe8770
--- /dev/null
+++ b/scouting/www/index.html
@@ -0,0 +1,10 @@
+<html>
+ <head>
+ <base href="/">
+ <script src="./npm/node_modules/zone.js/dist/zone.min.js"></script>
+ </head>
+ <body>
+ <my-app></my-app>
+ <script src="./main_bundle_compiled/main_bundle.js"></script>
+ </body>
+</html>
diff --git a/scouting/www/main.ts b/scouting/www/main.ts
new file mode 100644
index 0000000..e1a4ab5
--- /dev/null
+++ b/scouting/www/main.ts
@@ -0,0 +1,4 @@
+import {platformBrowser} from '@angular/platform-browser';
+import {AppModule} from './app_module';
+
+platformBrowser().bootstrapModule(AppModule);