Can't resolve parameters for app module

Question

I'm trying to run a hybrid app with angular 1.6 and 5. The manual bootstraping worked. As soon as I tried to bootstrap a hybrid application, I get the following error:

compiler.js?7e34:466 Uncaught Error: Can't resolve all parameters for AppModule: (?). at syntaxError (eval at (app.bundle.js:1852), :684:34) at CompileMetadataResolver._getDependenciesMetadata (eval at (app.bundle.js:1852), :15765:35) at CompileMetadataResolver._getTypeMetadata (eval at (app.bundle.js:1852), :15600:26) at CompileMetadataResolver.getNgModuleMetadata (eval at (app.bundle.js:1852), :15399:24) at JitCompiler._loadModules (eval at (app.bundle.js:1852), :33760:87) at JitCompiler._compileModuleAndComponents (eval at (app.bundle.js:1852), :33721:36) at JitCompiler.compileModuleAsync (eval at (app.bundle.js:1852), :33637:37) at CompilerImpl.compileModuleAsync (eval at (app.bundle.js:1864), :245:49) at PlatformRef.bootstrapModule (eval at (app.bundle.js:229), :5646:25) at 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'm using webpack. Here's part of my config:

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'
        },

Did you find a solution for this issue? Even I am facing this. I think the problem is _getTypeMetadata does not get the dependencies in the arguments when creating module meta data in getNgModuleMetadata. I don't know why this is happening though. The problem is not with UpgradeModule. Any module added in the constructor will throw up this issue — Dhawal, Apr 09 '18 at 11:40

score 0 · Answer 1 · answered Feb 05 '18 at 13:37

As far as the code you've shared everything seems to be in order. It could be though, that you're using yet another annotations library that's clashing with Angular's decorators. For example if you're using angular-ts-decorators it would certainly cause such a problem.

If this is the case - remove the other annotations library (which should now be redundant anyway) and use Angular's annotations instead.

score 0 · Answer 2 · answered May 16 '18 at 17:03

0

In my case after loading following JS, it got working:

./node_modules/core-js/client/shim.min.js
./node_modules/zone.js/dist/zone.js

answered May 16 '18 at 17:03

Sunny Yadav

55
1
6

Can't resolve parameters for app module

2 Answers2