ivy test

app/lib/index.ts

@@ -3,7 +3,7 @@ import './lru'
 import { app, ipcMain, Menu } from 'electron'
 import { parseArgs } from './cli'
 import { Application } from './app'
-import electronDebug = require('electron-debug')
+import * as electronDebug from 'electron-debug'
 
 if (!process.env.TERMINUS_PLUGINS) {
     process.env.TERMINUS_PLUGINS = ''

app/lib/window.ts

 import { Subject, Observable } from 'rxjs'
 import { debounceTime } from 'rxjs/operators'
 import { BrowserWindow, app, ipcMain, Rectangle, screen } from 'electron'
-import ElectronConfig = require('electron-config')
+import * as ElectronConfig from 'electron-config'
 import * as os from 'os'
 import * as path from 'path'
 

app/package.json

@@ -13,14 +13,14 @@
     "watch": "webpack --progress --color --watch"
   },
   "dependencies": {
-    "@angular/animations": "7.2.8",
-    "@angular/common": "7.2.8",
-    "@angular/compiler": "7.2.8",
-    "@angular/core": "7.2.8",
-    "@angular/forms": "7.2.8",
-    "@angular/platform-browser": "7.2.8",
-    "@angular/platform-browser-dynamic": "7.2.8",
-    "@ng-bootstrap/ng-bootstrap": "^4.2.2",
+    "@angular/animations": "9.0.0-rc.5",
+    "@angular/common": "9.0.0-rc.5",
+    "@angular/compiler": "9.0.0-rc.5",
+    "@angular/core": "9.0.0-rc.5",
+    "@angular/forms": "9.0.0-rc.5",
+    "@angular/platform-browser": "9.0.0-rc.5",
+    "@angular/platform-browser-dynamic": "9.0.0-rc.5",
+    "@ng-bootstrap/ng-bootstrap": "^5.1.4",
     "devtron": "1.4.0",
     "electron-config": "2.0.0",
     "electron-debug": "^3.0.1",
@@ -30,14 +30,14 @@
     "js-yaml": "3.13.1",
     "keytar": "^5.0.0",
     "mz": "^2.7.0",
-    "ngx-toastr": "^10.2.0",
+    "ngx-toastr": "^11.2.1",
     "node-pty": "^0.10.0-beta2",
     "npm": "6.9.0",
     "path": "0.12.7",
     "rxjs": "^6.5.3",
     "rxjs-compat": "^6.5.3",
     "yargs": "^15.0.2",
-    "zone.js": "^0.8.29"
+    "zone.js": "^0.10.2"
   },
   "optionalDependencies": {
     "macos-native-processlist": "^1.0.2",
@@ -47,6 +47,7 @@
     "windows-swca": "^2.0.2"
   },
   "devDependencies": {
+    "@angular/localize": "^9.0.0-rc.7",
     "@types/mz": "0.0.32",
     "@types/node": "12.7.12",
     "node-abi": "^2.13.0"

app/src/app.module.ts

-import { NgModule } from '@angular/core'
+import { NgModule, Compiler, Inject, Injector, ɵcreateInjector as createInjector } from '@angular/core'
+import '@angular/localize/init'
+import { CommonModule } from '@angular/common'
 import { BrowserModule } from '@angular/platform-browser'
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap'
 import { ToastrModule } from 'ngx-toastr'
 
-export function getRootModule (plugins: any[]) {
-    const imports = [
+@NgModule({
+    imports: [
         BrowserModule,
-        ...plugins,
-        NgbModule.forRoot(),
+        CommonModule,
+        NgbModule,
         ToastrModule.forRoot({
             positionClass: 'toast-bottom-center',
             toastClass: 'toast',
             preventDuplicates: true,
             extendedTimeOut: 5000,
         }),
-    ]
+    ],
+})
+export class RootModule {
+    constructor (
+        private compiler: Compiler,
+        private injector: Injector,
+        @Inject('plugins') private plugins: any[],
+    ) { }
+
+    async ngDoBootstrap (app) {
+        console.log('bootstrap', app)
+        for (let plugin of this.plugins) {
+            console.log(plugin)
+            // try {
+            const injector = createInjector(plugin, this.injector)
+            console.log(injector)
+                const module = await this.compiler.compileModuleAsync(plugin)
+                console.log(module)
+            // } catch (e) {
+            //     console.error('Failed loading', plugin, e)
+            // }
+        }
+    }
+}
+
+
+export function setupRootModule (plugins: any[]) {
     const bootstrap = [
         ...plugins.filter(x => x.bootstrap).map(x => x.bootstrap),
     ]
@@ -22,11 +50,4 @@ export function getRootModule (plugins: any[]) {
     if (bootstrap.length === 0) {
         throw new Error('Did not find any bootstrap components. Are there any plugins installed?')
     }
-
-    @NgModule({
-        imports,
-        bootstrap,
-    }) class RootModule { } // eslint-disable-line @typescript-eslint/no-extraneous-class
-
-    return RootModule
 }

app/src/entry.preload.ts

 import '../lib/lru'
+import 'core-js/proposals/reflect-metadata'
 import 'source-sans-pro/source-sans-pro.css'
 import 'source-code-pro/source-code-pro.css'
 import '@fortawesome/fontawesome-free/css/solid.css'
@@ -6,3 +7,71 @@ import '@fortawesome/fontawesome-free/css/brands.css'
 import '@fortawesome/fontawesome-free/css/fontawesome.css'
 import 'ngx-toastr/toastr.css'
 import './preload.scss'
+import * as path from 'path'
+
+const nodeModule = require('module') // eslint-disable-line @typescript-eslint/no-var-requires
+const nodeRequire = (global as any).require
+
+
+const builtinModules = [
+    '@angular/animations',
+    '@angular/common',
+    '@angular/compiler',
+    '@angular/core',
+    '@angular/forms',
+    '@angular/localize',
+    '@angular/platform-browser',
+    '@angular/platform-browser-dynamic',
+    '@ng-bootstrap/ng-bootstrap',
+    'ngx-toastr',
+    'rxjs',
+    'rxjs/operators',
+    'rxjs/internal/observable/fromEvent',
+    'rxjs/internal/observable/merge',
+    'rxjs-compat/Subject',
+    'zone.js/dist/zone.js',
+    'terminus-core',
+    // 'terminus-settings',
+    // 'terminus-terminal',
+]
+
+const cachedBuiltinModules = {}
+
+if (process.env.TERMINUS_DEV) {
+    console.info(path.dirname(require('electron').remote.app.getAppPath()))
+    nodeModule.globalPaths.unshift(path.dirname(require('electron').remote.app.getAppPath()))
+    nodeModule.globalPaths.unshift(path.join(require('electron').remote.app.getAppPath(), 'node_modules'))
+}
+
+const originalRequire = (global as any).require
+;(global as any).require = function (query: string) {
+    if (cachedBuiltinModules[query]) {
+        return cachedBuiltinModules[query]
+    }
+    return originalRequire.apply(this, arguments)
+}
+
+const originalModuleRequire = nodeModule.prototype.require
+nodeModule.prototype.require = function (query: string) {
+    if (cachedBuiltinModules[query]) {
+        return cachedBuiltinModules[query]
+    }
+    return originalModuleRequire.call(this, query)
+}
+
+global['require'].resolve = originalRequire.resolve
+nodeModule.prototype.require.resolve = originalModuleRequire.resolve
+
+builtinModules.forEach(m => {
+    const label = 'Caching ' + m
+    console.time(label)
+    try {
+        console.log(m + '/__ivy_ngcc__/fesm5/' + m.split('/')[1] + '.js')
+        cachedBuiltinModules[m] = nodeRequire(m + '/__ivy_ngcc__/fesm5/' + m.split('/')[1] + '.js')
+        console.log('loaded ivy')
+    } catch (e) {
+        console.error(e)
+        cachedBuiltinModules[m] = nodeRequire(m)
+    }
+    console.timeEnd(label)
+})

app/src/entry.ts

-import 'zone.js'
-import 'core-js/proposals/reflect-metadata'
-import 'rxjs'
-
 import * as isDev from 'electron-is-dev'
 
 import './global.scss'
@@ -10,7 +6,7 @@ import './toastr.scss'
 import { enableProdMode, NgModuleRef } from '@angular/core'
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'
 
-import { getRootModule } from './app.module'
+import { setupRootModule, RootModule } from './app.module'
 import { findPlugins, loadPlugins, PluginInfo } from './plugins'
 
 // Always land on the start view
@@ -32,12 +28,14 @@ async function bootstrap (plugins: PluginInfo[], safeMode = false): Promise<NgMo
     if (safeMode) {
         plugins = plugins.filter(x => x.isBuiltin)
     }
-    const pluginsModules = await loadPlugins(plugins, (current, total) => {
+    const pluginModules = await loadPlugins(plugins, (current, total) => {
         (document.querySelector('.progress .bar') as HTMLElement).style.width = `${100 * current / total}%` // eslint-disable-line
     })
-    const module = getRootModule(pluginsModules)
-    window['rootModule'] = module
-    return platformBrowserDynamic().bootstrapModule(module)
+    setupRootModule(pluginModules)
+    window['rootModule'] = RootModule
+    return platformBrowserDynamic([
+        { provide: 'plugins', useValue: pluginModules },
+    ]).bootstrapModule(RootModule)
 }
 
 findPlugins().then(async plugins => {

app/src/plugins.ts

@@ -14,9 +14,6 @@ function normalizePath (path: string): string {
 
 global['module'].paths.map((x: string) => nodeModule.globalPaths.push(normalizePath(x)))
 
-if (process.env.TERMINUS_DEV) {
-    nodeModule.globalPaths.unshift(path.dirname(require('electron').remote.app.getAppPath()))
-}
 
 const builtinPluginsPath = process.env.TERMINUS_DEV ? path.dirname(require('electron').remote.app.getAppPath()) : path.join((process as any).resourcesPath, 'builtin-plugins')
 
@@ -52,49 +49,6 @@ export interface PluginInfo {
     info?: any
 }
 
-const builtinModules = [
-    '@angular/animations',
-    '@angular/common',
-    '@angular/compiler',
-    '@angular/core',
-    '@angular/forms',
-    '@angular/platform-browser',
-    '@angular/platform-browser-dynamic',
-    '@ng-bootstrap/ng-bootstrap',
-    'ngx-toastr',
-    'rxjs',
-    'rxjs/operators',
-    'rxjs-compat/Subject',
-    'terminus-core',
-    'terminus-settings',
-    'terminus-terminal',
-    'zone.js/dist/zone.js',
-]
-
-const cachedBuiltinModules = {}
-builtinModules.forEach(m => {
-    const label = 'Caching ' + m
-    console.time(label)
-    cachedBuiltinModules[m] = nodeRequire(m)
-    console.timeEnd(label)
-})
-
-const originalRequire = (global as any).require
-;(global as any).require = function (query: string) {
-    if (cachedBuiltinModules[query]) {
-        return cachedBuiltinModules[query]
-    }
-    return originalRequire.apply(this, arguments)
-}
-
-const originalModuleRequire = nodeModule.prototype.require
-nodeModule.prototype.require = function (query: string) {
-    if (cachedBuiltinModules[query]) {
-        return cachedBuiltinModules[query]
-    }
-    return originalModuleRequire.call(this, query)
-}
-
 export async function findPlugins (): Promise<PluginInfo[]> {
     const paths = nodeModule.globalPaths
     let foundPlugins: PluginInfo[] = []
@@ -167,6 +121,7 @@ export async function loadPlugins (foundPlugins: PluginInfo[], progress: Progres
     progress(0, 1)
     let index = 0
     for (const foundPlugin of foundPlugins) {
+        if (foundPlugin.name !== 'core') continue
         console.info(`Loading ${foundPlugin.name}: ${nodeRequire.resolve(foundPlugin.path)}`)
         progress(index, foundPlugins.length)
         try {

app/src/root.component.ts

-import { Component } from '@angular/core'
-
-@Component({
-    template: '<app-root></app-root>',
-})
-export class RootComponent { } // eslint-disable-line @typescript-eslint/no-extraneous-class

app/tsconfig.json

 {
     "compilerOptions": {
         "baseUrl": "./src",
-        "module": "commonjs",
+        "module": "es2015",
+        "moduleResolution": "node",
         "target": "es2015",
         "declaration": false,
         "noImplicitAny": false,
@@ -19,7 +20,10 @@
            "es2015.iterable",
            "es2017",
            "es7"
-        ]
+        ],
+        "paths": {
+            "*": ["../../app/node_modules/*"]
+        }
     },
     "compileOnSave": false,
     "exclude": [
@@ -28,5 +32,9 @@
         "*/node_modules",
         "terminus*",
         "platforms"
-    ]
+    ],
+    "angularCompilerOptions": {
+        "enableIvy": true,
+        "disableTypeScriptVersionCheck": true
+    }
 }

app/webpack.config.js

 const path = require('path')
 const webpack = require('webpack')
+const { AngularCompilerPlugin } = require('@ngtools/webpack')
 
 module.exports = {
   name: 'terminus',
@@ -28,13 +29,8 @@ module.exports = {
   module: {
     rules: [
       {
-        test: /\.ts$/,
-        use: {
-          loader: 'awesome-typescript-loader',
-          options: {
-            configFileName: path.resolve(__dirname, 'tsconfig.json'),
-          },
-        },
+          test: /(?:\.ngfactory\.js|\.ngfactory|\.ngstyle\.js|\.ts)$/,
+          loader: '@ngtools/webpack',
       },
       { test: /\.scss$/, use: ['style-loader', 'css-loader', 'sass-loader'] },
       { test: /\.css$/, use: ['style-loader', 'css-loader', 'sass-loader'] },
@@ -82,5 +78,10 @@ module.exports = {
     new webpack.DefinePlugin({
       'process.type': '"renderer"'
     }),
+    new AngularCompilerPlugin({
+        tsConfigPath: path.resolve(__dirname, 'tsconfig.json'),
+        entryModule: 'src/index#default',
+        sourceMap: true,
+    }),
   ],
 }

package.json

 {
   "devDependencies": {
+    "@angular/compiler": "9.0.0-rc.5",
+    "@angular/compiler-cli": "9.0.0-rc.5",
+    "@angular/core": "9.0.0-rc.5",
     "@fortawesome/fontawesome-free": "^5.11.2",
+    "@ngtools/webpack": "9.0.0-rc.5",
     "@sentry/cli": "^1.49.0",
     "@sentry/electron": "^1.0.0",
     "@types/electron-config": "^3.2.2",
@@ -14,7 +18,7 @@
     "awesome-typescript-loader": "^5.0.0",
     "core-js": "^3.4.2",
     "cross-env": "6.0.3",
-    "css-loader": "3.2.1",
+    "css-loader": "3.4.0",
     "electron": "^7.1.3",
     "electron-builder": "22.1.0",
     "electron-download": "^4.1.1",
@@ -49,8 +53,8 @@
     "typedoc": "^0.15.3",
     "typescript": "^3.7.3",
     "url-loader": "^3.0.0",
-    "val-loader": "2.0.1",
-    "webpack": "^5.0.0-beta.7",
+    "val-loader": "2.1.0",
+    "webpack": "4",
     "webpack-cli": "^3.3.10",
     "yaml-loader": "0.5.0"
   },

scripts/install-deps.js

@@ -25,8 +25,5 @@ if (['darwin', 'linux'].includes(process.platform)) {
   for (let x of vars.builtinPlugins) {
     sh.ln('-fs', '../' + x, x)
   }
-  for (let x of vars.bundledModules) {
-    sh.ln('-fs', '../app/node_modules/' + x, x)
-  }
   sh.cd('..')
 }

scripts/vars.js

@@ -22,8 +22,4 @@ exports.builtinPlugins = [
   'terminus-plugin-manager',
   'terminus-ssh',
 ]
-exports.bundledModules = [
-  '@angular',
-  '@ng-bootstrap',
-]
 exports.electronVersion = electronInfo.version

terminus-core/src/components/appRoot.component.pug

@@ -10,8 +10,8 @@ title-bar(
         .inset.background(*ngIf='hostApp.platform == Platform.macOS && config.store.appearance.frame == "thin" && config.store.appearance.tabsLocation == "top"')
         .tabs(
             dnd-sortable-container,
-            [sortableData]='app.tabs',
         )
+            //- [sortableData]='app.tabs',
             tab-header(
                 *ngFor='let tab of app.tabs; let idx = index',
                 dnd-sortable,

terminus-core/src/components/appRoot.component.ts

@@ -20,8 +20,8 @@ import { AppService, ToolbarButton, ToolbarButtonProvider } from '../api'
 /** @hidden */
 @Component({
     selector: 'app-root',
-    template: require('./appRoot.component.pug'),
-    styles: [require('./appRoot.component.scss')],
+    templateUrl: './appRoot.component.pug',
+    styleUrls: ['./appRoot.component.scss'],
     animations: [
         trigger('animateTab', [
             state('in', style({

terminus-core/src/components/renameTabModal.component.ts

@@ -4,7 +4,7 @@ import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'
 /** @hidden */
 @Component({
     selector: 'rename-tab-modal',
-    template: require('./renameTabModal.component.pug'),
+    templateUrl: './renameTabModal.component.pug',
 })
 export class RenameTabModalComponent {
     @Input() value: string

terminus-core/src/components/safeModeModal.component.ts

@@ -3,7 +3,7 @@ import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'
 
 /** @hidden */
 @Component({
-    template: require('./safeModeModal.component.pug'),
+    templateUrl: './safeModeModal.component.pug',
 })
 export class SafeModeModalComponent {
     @Input() error: Error

terminus-core/src/components/splitTab.component.ts

@@ -138,7 +138,7 @@ export interface SplitSpannerInfo {
             (change)='onSpannerAdjusted(spanner)'
         ></split-tab-spanner>
     `,
-    styles: [require('./splitTab.component.scss')],
+    styleUrls: ['./splitTab.component.scss'],
 })
 export class SplitTabComponent extends BaseTabComponent implements OnInit, OnDestroy {
     /** @hidden */

terminus-core/src/components/splitTabSpanner.component.ts

@@ -5,7 +5,7 @@ import { SplitContainer } from './splitTab.component'
 @Component({
     selector: 'split-tab-spanner',
     template: '',
-    styles: [require('./splitTabSpanner.component.scss')],
+    styleUrls: ['./splitTabSpanner.component.scss'],
 })
 export class SplitTabSpannerComponent {
     @Input() container: SplitContainer

terminus-core/src/components/startPage.component.ts

@@ -7,8 +7,8 @@ import { ToolbarButton, ToolbarButtonProvider } from '../api'
 /** @hidden */
 @Component({
     selector: 'start-page',
-    template: require('./startPage.component.pug'),
-    styles: [require('./startPage.component.scss')],
+    templateUrl: './startPage.component.pug',
+    styleUrls: ['./startPage.component.scss'],
 })
 export class StartPageComponent {
     version: string

terminus-core/src/components/tabBody.component.ts

@@ -10,9 +10,9 @@ import { BaseTabComponent } from '../components/baseTab.component'
         </perfect-scrollbar-->
         <ng-template #placeholder></ng-template>
     `,
-    styles: [
-        require('./tabBody.component.scss'),
-        require('./tabBody.deep.component.css'),
+    styleUrls: [
+        './tabBody.component.scss',
+        './tabBody.deep.component.css',
     ],
 })
 export class TabBodyComponent implements OnChanges {

terminus-core/src/components/tabHeader.component.ts

@@ -17,8 +17,8 @@ export interface SortableComponentProxy {
 /** @hidden */
 @Component({
     selector: 'tab-header',
-    template: require('./tabHeader.component.pug'),
-    styles: [require('./tabHeader.component.scss')],
+    templateUrl: './tabHeader.component.pug',
+    styleUrls: ['./tabHeader.component.scss'],
 })
 export class TabHeaderComponent {
     @Input() index: number

terminus-core/src/components/titleBar.component.ts

 import { Component } from '@angular/core'
+import { HostAppService } from '../services/hostApp.service'
 
 /** @hidden */
 @Component({
     selector: 'title-bar',
-    template: require('./titleBar.component.pug'),
-    styles: [require('./titleBar.component.scss')],
+    templateUrl: './titleBar.component.pug',
+    styleUrls: ['./titleBar.component.scss'],
 })
-export class TitleBarComponent { } // eslint-disable-line @typescript-eslint/no-extraneous-class
+export class TitleBarComponent {
+    constructor (public hostApp: HostAppService) { }
+}

terminus-core/src/components/toggle.component.ts

@@ -11,7 +11,7 @@ import { CheckboxComponent } from './checkbox.component'
       <label class="custom-control-label"></label>
     </div>
     `,
-    styles: [require('./toggle.component.scss')],
+    styleUrls: ['./toggle.component.scss'],
     providers: [
         { provide: NG_VALUE_ACCESSOR, useExisting: ToggleComponent, multi: true },
     ],

terminus-core/src/components/welcomeTab.component.ts

@@ -6,8 +6,8 @@ import { AppService } from '../services/app.service'
 /** @hidden */
 @Component({
     selector: 'welcome-page',
-    template: require('./welcomeTab.component.pug'),
-    styles: [require('./welcomeTab.component.scss')],
+    templateUrl: './welcomeTab.component.pug',
+    styleUrls: ['./welcomeTab.component.scss'],
 })
 export class WelcomeTabComponent extends BaseTabComponent {
     constructor (

terminus-core/src/components/windowControls.component.ts

@@ -5,8 +5,8 @@ import { AppService } from '../services/app.service'
 /** @hidden */
 @Component({
     selector: 'window-controls',
-    template: require('./windowControls.component.pug'),
-    styles: [require('./windowControls.component.scss')],
+    templateUrl: './windowControls.component.pug',
+    styleUrls: ['./windowControls.component.scss'],
 })
 export class WindowControlsComponent {
     constructor (public hostApp: HostAppService, public app: AppService) { }

terminus-core/src/index.ts

-import { NgModule, ModuleWithProviders } from '@angular/core'
+import { NgModule } from '@angular/core'
 import { BrowserModule } from '@angular/platform-browser'
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'
 import { FormsModule } from '@angular/forms'
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap'
 import { PerfectScrollbarModule, PERFECT_SCROLLBAR_CONFIG } from 'ngx-perfect-scrollbar'
-import { DndModule } from 'ng2-dnd'
+// import { DndModule } from 'ng2-dnd'
 
 import { AppRootComponent } from './components/appRoot.component'
 import { CheckboxComponent } from './components/checkbox.component'
@@ -25,7 +26,7 @@ import { AutofocusDirective } from './directives/autofocus.directive'
 import { HotkeyProvider } from './api/hotkeyProvider'
 import { ConfigProvider } from './api/configProvider'
 import { Theme } from './api/theme'
-import { TabContextMenuItemProvider } from './api/tabContextMenuProvider'
+// import { TabContextMenuItemProvider } from './api/tabContextMenuProvider'
 import { TabRecoveryProvider } from './api/tabRecovery'
 
 import { AppService } from './services/app.service'
@@ -34,7 +35,7 @@ import { ConfigService } from './services/config.service'
 import { StandardTheme, StandardCompactTheme, PaperTheme } from './theme'
 import { CoreConfigProvider } from './config'
 import { AppHotkeyProvider } from './hotkeys'
-import { TaskCompletionContextMenu, CommonOptionsContextMenu, CloseContextMenu } from './tabContextMenu'
+// import { TaskCompletionContextMenu, CommonOptionsContextMenu, CloseContextMenu } from './tabContextMenu'
 
 import 'perfect-scrollbar/css/perfect-scrollbar.css'
 import 'ng2-dnd/bundles/style.css'
@@ -51,9 +52,9 @@ const PROVIDERS = [
     { provide: Theme, useClass: StandardCompactTheme, multi: true },
     { provide: Theme, useClass: PaperTheme, multi: true },
     { provide: ConfigProvider, useClass: CoreConfigProvider, multi: true },
-    { provide: TabContextMenuItemProvider, useClass: CommonOptionsContextMenu, multi: true },
-    { provide: TabContextMenuItemProvider, useClass: CloseContextMenu, multi: true },
-    { provide: TabContextMenuItemProvider, useClass: TaskCompletionContextMenu, multi: true },
+    // { provide: TabContextMenuItemProvider, useClass: CommonOptionsContextMenu, multi: true },
+    // { provide: TabContextMenuItemProvider, useClass: CloseContextMenu, multi: true },
+    // { provide: TabContextMenuItemProvider, useClass: TaskCompletionContextMenu, multi: true },
     { provide: TabRecoveryProvider, useClass: SplitTabRecoveryProvider, multi: true },
     { provide: PERFECT_SCROLLBAR_CONFIG, useValue: { suppressScrollX: true } },
 ]
@@ -64,10 +65,11 @@ const PROVIDERS = [
         BrowserModule,
         BrowserAnimationsModule,
         FormsModule,
-        NgbModule.forRoot(),
+        NgbModule,
         PerfectScrollbarModule,
-        DndModule.forRoot(),
+        // DndModule,
     ],
+    providers: PROVIDERS,
     declarations: [
         AppRootComponent as any,
         CheckboxComponent,
@@ -96,7 +98,7 @@ const PROVIDERS = [
         AutofocusDirective,
     ],
 })
-export default class AppModule { // eslint-disable-line @typescript-eslint/no-extraneous-class
+export class AppModule { // eslint-disable-line @typescript-eslint/no-extraneous-class
     constructor (app: AppService, config: ConfigService) {
         app.ready$.subscribe(() => {
             if (config.store.enableWelcomeTab) {
@@ -104,18 +106,17 @@ export default class AppModule { // eslint-disable-line @typescript-eslint/no-ex
             }
         })
     }
-
-    static forRoot (): ModuleWithProviders {
-        return {
-            ngModule: AppModule,
-            providers: PROVIDERS,
-        }
-    }
 }
 
+export default AppModule
+
 export { AppRootComponent as bootstrap }
 export * from './api'
 
 // Deprecations
 export { ToolbarButton as IToolbarButton } from './api'
 export { HotkeyDescription as IHotkeyDescription } from './api'
+
+export function fakeBootstrap () {
+    return platformBrowserDynamic().bootstrapModule(AppModule)
+}

terminus-core/src/tabContextMenu.ts

@@ -5,7 +5,7 @@ import { TabHeaderComponent } from './components/tabHeader.component'
 import { TabContextMenuItemProvider } from './api/tabContextMenuProvider'
 
 /** @hidden */
-@Injectable()
+@Injectable({ providedIn: 'root' })
 export class CloseContextMenu extends TabContextMenuItemProvider {
     weight = -5
 
@@ -63,7 +63,7 @@ const COLORS = [
 ]
 
 /** @hidden */
-@Injectable()
+@Injectable({ providedIn: 'root' })
 export class CommonOptionsContextMenu extends TabContextMenuItemProvider {
     weight = -1
 
@@ -101,7 +101,7 @@ export class CommonOptionsContextMenu extends TabContextMenuItemProvider {
 }
 
 /** @hidden */
-@Injectable()
+@Injectable({ providedIn: 'root' })
 export class TaskCompletionContextMenu extends TabContextMenuItemProvider {
     constructor (
         private app: AppService,

terminus-core/tsconfig.json

@@ -2,6 +2,9 @@
   "extends": "../tsconfig.json",
   "exclude": ["node_modules", "dist"],
   "compilerOptions": {
-    "baseUrl": "src"
+    "baseUrl": "src",
+    "paths": {
+      "*": ["../../app/node_modules/*"]
+    }
   }
 }

terminus-core/webpack.config.js

 const path = require('path')
+const { AngularCompilerPlugin } = require('@ngtools/webpack')
 
 module.exports = {
     target: 'node',
     entry: 'src/index.ts',
     context: __dirname,
-    devtool: 'eval-cheap-module-source-map',
+    devtool: 'cheap-module-source-map',
     output: {
         path: path.resolve(__dirname, 'dist'),
         filename: 'index.js',
@@ -23,22 +24,26 @@ module.exports = {
     module: {
         rules: [
             {
-                test: /\.ts$/,
-                use: {
-                    loader: 'awesome-typescript-loader',
-                    options: {
-                        configFileName: path.resolve(__dirname, 'tsconfig.json'),
-                        typeRoots: [
-                            path.resolve(__dirname, 'node_modules/@types'),
-                            path.resolve(__dirname, '../node_modules/@types'),
-                        ],
-                        paths: {
-                            "terminus-*": [path.resolve(__dirname, '../terminus-*')],
-                            "*": [path.resolve(__dirname, '../app/node_modules/*')],
-                        },
-                    },
-                },
+                test: /(?:\.ngfactory\.js|\.ngfactory|\.ngstyle\.js|\.ts)$/,
+                loader: '@ngtools/webpack',
             },
+            // {
+            //     test: /\.ts$/,
+            //     use: {
+            //         loader: 'awesome-typescript-loader',
+            //         options: {
+            //             configFileName: path.resolve(__dirname, 'tsconfig.json'),
+            //             typeRoots: [
+            //                 path.resolve(__dirname, 'node_modules/@types'),
+            //                 path.resolve(__dirname, '../node_modules/@types'),
+            //             ],
+            //             paths: {
+            //                 "terminus-*": [path.resolve(__dirname, '../terminus-*')],
+            //                 "*": [path.resolve(__dirname, '../app/node_modules/*')],
+            //             },
+            //         },
+            //     },
+            // },
             { test: /\.pug$/, use: ['apply-loader', 'pug-loader'] },
             { test: /\.scss$/, use: ['to-string-loader', 'css-loader', 'sass-loader'] },
             { test: /\.css$/, use: ['to-string-loader', 'css-loader'], include: /component\.css/ },
@@ -57,4 +62,12 @@ module.exports = {
         /^@angular/,
         /^@ng-bootstrap/,
     ],
+    plugins: [
+        new AngularCompilerPlugin({
+            tsConfigPath: path.resolve(__dirname, 'tsconfig.json'),
+            entryModule: './terminus-core/src/index#AppModule',
+            sourceMap: true,
+            directTemplateLoading: true,
+        }),
+    ],
 }

terminus-ssh/src/components/promptModal.component.ts

@@ -6,6 +6,7 @@ import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'
     template: require('./promptModal.component.pug'),
 })
 export class PromptModalComponent {
+    @Input() prompt: string
     @Input() value: string
     @Input() password: boolean
     @Input() remember: boolean

tsconfig.json

 {
   "compilerOptions": {
     "module": "es2015",
-    "target": "es2016",
+    "target": "es5",
     "moduleResolution": "node",
     "noImplicitAny": false,
     "removeComments": false,
@@ -25,5 +25,9 @@
       "es2015",
       "es2017"
     ]
+  },
+  "angularCompilerOptions": {
+    "enableIvy": true,
+    "disableTypeScriptVersionCheck": true
   }
 }