Can't resolve all parameters for ApplicationModule: (?) - Angular 7 JIT

Question

Hello i am facing issue which looks to be appear randomly. All my setup was working like charm.

I have couple of angular application compiled with webpack. all work fine in AOT but crash on JIT. It because the compiler are not able to understand annotation.

compiler.js:2700 Uncaught Error: Can't resolve all parameters for ApplicationModule: (?).
    at syntaxError (compiler.js:2700)
    at CompileMetadataResolver._getDependenciesMetadata (compiler.js:19254)

I use "core-js": "^2.6.5" (i have also try with 3.0.1 )

I have on my polyfill.ts all reflect as following :

import 'core-js/es6/reflect';
import 'core-js/es7/reflect';

my webpack configure contain following rules :

[
    {
        loader: 'babel-loader',
        options: babelOptions
    },
    {
        loader: 'ts-loader',
        options: {
            transpileOnly: true
        }
    },
    {
        loader: 'angular2-template-loader'
    }
]

And my babel configuration looks like this :

presets: [
    [
        '@babel/preset-env',
        {
            modules: false,
            loose: true,
            targets: {
                browsers: [
                    "last 2 versions",
                    "not ie <= 10"
                ]
            },
            useBuiltIns: 'usage',
            corejs: "2",
            debug: false
        }
    ]
]

What i have try so far ?

• Upgrade and downgrade core-js.
• Upgrade and downgrade angular 7.

You can have look on minimal proof of issue on this Github repo

Answer 1

I have an Angular Application in v5 and recently upgraded to v9, purely add import 'core-js/es7/reflect'; to the top of boot.ts or polyfill.ts cannot fix the problem

But once I load reflect-metadata in the very first line, everything fixed.

import 'reflect-metadata';
import 'core-js/es7/reflect';

Answer 2

You should only import

import 'core-js/es7/reflect';

as it have been an issue in github page at here and here

The working repo code