TIL, 2022-10-14, App Initialization

We can catch errors before the app initializes.

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

const { shortBrandName, env } = environment;

if (environment.production) {
  enableProdMode();
}

platformBrowserDynamic()
  .bootstrapModule(AppModule)
  .catch((err: Error) => {
    reportAppBootstrapFailure({ err, shortBrandName, env });
  });

Rollbar context can be used in Rollbar SQL.
APP_INITIALIZER for the Bootstrap process.
Renderer - this can be used in an effect. Reference
Overlay container: Reference
- Literally is just a selector to get the overlay element
You can’t deconstruct in import statements. It doesn’t work like that. You can do a let after to deconstruct what you’ve imported.
Just styling the page if the app didn’t start anyway:

const body = document.querySelector('body')!;
const div = document.createElement('div')!;

body.style.cssText = 'display: flex; justify-content:center; align-items: center;';
div.style.cssText = 'max-width: 600px; margin: 50px; padding: 50px; text-align: center';