How to use @aurelia/jit-html-browser - 5 common examples

// DefaultBindingCommand,
    // ForBindingCommand,
    // FromViewBindingCommand,
    // OneTimeBindingCommand,
    // ToViewBindingCommand,
    // TwoWayBindingCommand,
    // IExpressionParserRegistration,
    // DefaultComponents as JitDefaultComponents,
    // RefAttributePatternRegistration,
    // DotSeparatedAttributePatternRegistration,
    // DefaultBindingSyntax,
    // AtPrefixedTriggerAttributePatternRegistration,
    // ColonPrefixedBindAttributePatternRegistration,
    exports.ShortHandBindingSyntax = jit_1.ShortHandBindingSyntax;
    var jit_html_browser_1 = require("@aurelia/jit-html-browser");
    exports.JitHtmlBrowserConfiguration = jit_html_browser_1.JitHtmlBrowserConfiguration;
    var kernel_1 = require("@aurelia/kernel");
    exports.all = kernel_1.all;
    exports.DI = kernel_1.DI;
    exports.IContainer = kernel_1.IContainer;
    // IDefaultableInterfaceSymbol,
    // IFactory,
    exports.inject = kernel_1.inject;
    exports.IServiceLocator = kernel_1.IServiceLocator;
    exports.lazy = kernel_1.lazy;
    exports.optional = kernel_1.optional;
    // RegisterSelf,
    exports.Registration = kernel_1.Registration;
    // ResolveCallback,
    exports.singleton = kernel_1.singleton;
    exports.transient = kernel_1.transient;
    // Injectable,

function createAurelia() {
        const au = new Aurelia();
        au.register(jit_html_browser_1.JitHtmlBrowserConfiguration);
        // eslint-disable-next-line sonarjs/no-collapsible-if
        if (typeof process !== 'undefined' && typeof process.env === 'object') {
            // Just use NODE_ENV to control build process.
            // Bundlers (at least webpack/dumber/parcel) have feature to remove this branch in production.
            // Then tree-shaking/minifier will remove unused DebugConfiguration import.
            if (process.env.NODE_ENV !== 'production') {
                au.register(debug_1.DebugConfiguration);
            }
        }
        return au;
    }
    class Aurelia extends runtime_1.Aurelia {

import { Dates } from './components/dates';
import { Email } from './components/email';
import { Header } from './components/header';
import { Inbox } from './components/inbox';
import { Recursive } from './components/recursive';
import { Schedule } from './components/schedule';

import { One } from './components/one';
import { Three } from './components/three';
import { Two } from './components/two';

import { Alpha } from './components/alpha';
import { Beta } from './components/beta';
import { Sub } from './components/sub';

const container = JitHtmlBrowserConfiguration.createContainer();

container.register(
  ViewportCustomElement as any,
  NavCustomElement as any,
  GotoCustomElement as any,
  App as any,
  State as any,
);
registerComponent(
  container,
  AbcComponent as any,
  DefComponent as any,

  Email as any,
  Calendar as any,
  About as any,

import { NavCustomElement, ViewportCustomElement } from '../../../../../router/src/index';
import { GotoCustomElement } from './components/goto';
import { State } from './state';

import { App } from './app';

import { About } from './components/about';
import { Calendar } from './components/calendar';
import { Contacts } from './components/contacts';
import { Dates } from './components/dates';
import { Email } from './components/email';
import { Inbox } from './components/inbox';
import { Recursive } from './components/recursive';
import { Schedule } from './components/schedule';

const container = JitHtmlBrowserConfiguration.createContainer();

container.register(
  ViewportCustomElement as any,
  NavCustomElement as any,
  GotoCustomElement as any,
  App as any,
  State as any,
);
registerComponent(
  container,

  Email as any,
  Calendar as any,
  About as any,
  Contacts as any,
  Inbox as any,

import { NavCustomElement, ViewportCustomElement } from '@aurelia/router';
import { DebugConfiguration } from '@aurelia/debug';
import { BasicConfiguration } from '@aurelia/jit-html-browser';
import { Aurelia } from '@aurelia/runtime';

import { registerComponent } from './utils';

import { App } from './app';

import { RouterHome } from './components/router/home';
import { RouterWithNav } from './components/router/with-nav';

const container = BasicConfiguration.createContainer();

container.register(
  ViewportCustomElement as any,
  NavCustomElement as any
);

registerComponent(
  container,
  RouterHome as any,
  RouterWithNav as any
);

window['au'] = new Aurelia(container)
  .register(DebugConfiguration)
  .app({ host: document.querySelector('app'), component: App })
  .start();