diff --git a/templates/app/angular-default/template/package.json b/templates/app/angular-default/template/package.json
index 3f0a13d2efe..fbf91fb0d61 100644
--- a/templates/app/angular-default/template/package.json
+++ b/templates/app/angular-default/template/package.json
@@ -25,8 +25,8 @@
     "@angular-eslint/template-parser": "0.5.0-beta.4",
     "@angular/compiler-cli": "~9.1.0",
     "@ngtools/webpack": "~9.1.0",
-    "@titanium-sdk/webpack-plugin-angular": "^0.1.2",
-    "@types/titanium": "~9.1.0",
+    "@titanium-sdk/webpack-plugin-angular": "^0.2.0",
+    "@types/titanium": "~9.2.0",
     "@typescript-eslint/eslint-plugin": "^4.4.1",
     "@typescript-eslint/parser": "^4.4.1",
     "eslint": "^7.11.0",
diff --git a/templates/app/angular-default/template/src/app/app.module.ts b/templates/app/angular-default/template/src/app/app.module.ts
index a3f46ba47b3..2defc760a30 100644
--- a/templates/app/angular-default/template/src/app/app.module.ts
+++ b/templates/app/angular-default/template/src/app/app.module.ts
@@ -20,5 +20,7 @@ import { IntroComponent } from './intro.component';
   schemas: [NO_ERRORS_SCHEMA]
 })
 export class AppModule {
-
+  constructor() {
+    Ti.UI.backgroundColor = Ti.UI.fetchSemanticColor('primaryBg');
+  }
 }
diff --git a/templates/app/angular-default/template/src/assets/semantic.colors.json b/templates/app/angular-default/template/src/assets/semantic.colors.json
new file mode 100644
index 00000000000..8b317fd7108
--- /dev/null
+++ b/templates/app/angular-default/template/src/assets/semantic.colors.json
@@ -0,0 +1,6 @@
+{
+  "primaryBg": {
+    "dark": "#272727",
+    "light": "#ffffff"
+  }
+}
diff --git a/templates/app/angular-default/template/src/environments/environment.prod.ts b/templates/app/angular-default/template/src/environments/environment.prod.ts
new file mode 100644
index 00000000000..3612073bc31
--- /dev/null
+++ b/templates/app/angular-default/template/src/environments/environment.prod.ts
@@ -0,0 +1,3 @@
+export const environment = {
+  production: true
+};
diff --git a/templates/app/angular-default/template/src/environments/environment.ts b/templates/app/angular-default/template/src/environments/environment.ts
new file mode 100644
index 00000000000..4479b1867d9
--- /dev/null
+++ b/templates/app/angular-default/template/src/environments/environment.ts
@@ -0,0 +1,14 @@
+// This file will be replaced during production builds by environment.prod.ts
+
+export const environment = {
+  production: false
+};
+
+/*
+ * For easier debugging in development mode, you can import the following file
+ * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
+ *
+ * This import should be commented out in production mode because it will have a negative impact
+ * on performance if an error is thrown.
+ */
+// import 'zone.js/dist/zone-error';  // Included with Angular CLI.
diff --git a/templates/app/angular-default/template/src/main.aot.ts b/templates/app/angular-default/template/src/main.aot.ts
deleted file mode 100644
index 583492dcb06..00000000000
--- a/templates/app/angular-default/template/src/main.aot.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-import { platformTitanium } from 'titanium-angular';
-import { AppModuleNgFactory } from './app/app.module.ngfactory';
-
-platformTitanium().bootstrapModuleFactory(AppModuleNgFactory);
diff --git a/templates/app/angular-default/template/src/main.ts b/templates/app/angular-default/template/src/main.ts
index 9b3448f5865..baf0dc42c1d 100644
--- a/templates/app/angular-default/template/src/main.ts
+++ b/templates/app/angular-default/template/src/main.ts
@@ -1,6 +1,13 @@
 import './polyfills';
+import { enableProdMode } from '@angular/core';
 import { platformTitaniumDynamic } from 'titanium-angular';
+
 import { AppModule } from './app/app.module';
+import { environment } from './environments/environment';
+
+if (environment.production) {
+  enableProdMode();
+}
 
-platformTitaniumDynamic()
-  .bootstrapModule(AppModule);
+platformTitaniumDynamic().bootstrapModule(AppModule)
+  .catch(err => console.error(err));