Calling function 'makeDecorator', function calls are not supported

Question

Solved by @alexzuza. See his answer below - big ups! Basically, remove the node_modules folder from the ng2-opd-popup folder, and edit the src/tsconfig.app.json to match the path. See comments also for link to rimraf setup, to automatically exclude the node_modules from being installed with npm install.

I get this error:

ERROR in Error encountered resolving symbol values statically. Calling function 'makeDecorator', function calls are not supported. Consider replacing the function or lambda with a reference to an exported function

The solution found here, is not working - im running angular v. 4.3.

package.json:

PopupModule.forRoot(),

tsconfig.json:

"paths": {
  "@angular/*": ["node_modules/@angular/*"]
},

tsconfig.json:

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": ".",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "paths": {
      "@angular/common": ["../node_modules/@angular/common"],
      "@angular/compiler": ["../node_modules/@angular/compiler"],
      "@angular/core": ["../node_modules/@angular/core"],
      "@angular/forms": ["../node_modules/@angular/forms"],
      "@angular/platform-browser": ["../node_modules/@angular/platform-browser"],
      "@angular/platform-browser-dynamic": ["../node_modules/@angular/platform-browser-dynamic"],
      "@angular/router": ["../node_modules/@angular/router"],
      "@angular/http": ["../node_modules/@angular/http"]
    },
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

tsconfig.app.json:

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": ".",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "paths": {
      "@angular/*": ["../node_modules/@angular/*"]
    },
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

My file structure.

The package im trying to use: ng2-opd-popup

Somebody got a solution for this, or maybe a better package to use?

Answer 1

Change src/tsconfig.app.json like:

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "baseUrl": "./",
    "module": "es2015",
    "types": [],
    "paths": {
      "@angular/*": ["../node_modules/@angular/*"] <=== add this
    }
  },
  "exclude": [
    "test.ts",
    "**/*.spec.ts"
  ]
}

You should use .. because baseUrl refers to src folder

https://github.com/alexzuza/angular-cli-make-decorator-fix

It should work for aot, but for jit mode you have to remove node_modules/ng2-opd-popup/node_modules folder