Unable to resolve settings for application module.

Question

I am trying to run a hybrid application with angular 1.6 and 5. Manual download worked. As soon as I tried to download the hybrid application, I get the following error:

compiler.js? 7e34: 466 Uncaught Error: Unable to resolve all parameters for AppModule: (?). in the syntax Error (eval at (app.bundle.js: 1852) ,: 684: 34) in CompileMetadataResolver._getDependenciesMetadata (eval at (app.bundle.js: 1852),: 15765: 35) in CompileMetadataResolver._getTypeMet (at app.bundle.js: 1852) ,: 15600: 26) in CompileMetadataResolver.getNgModuleMetadata (eval at (app.bundle.js: 1852),: 15399: 24) in JitCompiler._loadModules (eval at (app.bundle.js: 1852) ,: 33760: 87) in JitCompiler._compileModuleAndComponents (eval at (app.bundle.js: 1852) ,: 33721: 36) in JitCompiler.compileModuleAsync (eval at (app.bundle.js: 1852),: 33637: 37) in CompilerImpl.compileModuleAsync (eval at (app.bundle.js: 1864) ,: 245: 49) in PlatformRef.bootstrapModule (eval at (app.bundle.js: 229),: 5646:25) on eval (eval at (app.bundle.js: 827) ,: 76: 53)

app.ts

platformBrowserDynamic().bootstrapModule(AppModule);

app.module.ts

import {NgModule} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';
import {UpgradeModule} from '@angular/upgrade/static';

@NgModule({
    imports: [
        BrowserModule,
        UpgradeModule
    ]
})
export class AppModule {
    constructor(private upgrade: UpgradeModule) {
    }

    ngDoBootstrap() {
        this.upgrade.bootstrap(document.documentElement, ['myApp']);
    }
}

tsconfig.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "module": "commonjs",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

I am using webpack. Here is part of my configuration:

resolve: {
    extensions: ['.js', '.ts'],
    alias: {
        "@angular/upgrade/static": "@angular/upgrade/bundles/upgrade-static.umd.js"
    }
},

module: {
    rules: [
        {
            test: /\.ts$/,
            loader: 'ts-loader',
            exclude: '/node_modules'
        },

Answer 1

As for the code you shared, everything seems to be in order. Perhaps you are using another annotation library that interferes with Angular decorators. For example, if you use angular-ts-decorators , this will certainly cause such a problem.

If so, delete another annotation library (which should now be redundant) and use Angular annotations instead.