CODEWITHSUNDEEP
angularnpmangular-cli
Mattew Eon
Mattew Eon

Reputation: 1783

Angular 4 : Why compiling a project with my package hosted with npm trigger a 'makeDecorator' error on compilation

I got this error since I started to code my two npm packages, and I can't find a solution for this issue. Each time I run ng serve, I have this error, and then if I just add a space character and Ctrl+S a file (to run an Angular-CLI compilation) It diseapper ! How to resolve 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, resolving symbol NgModule in D:/GitHub/angular-npm/ngx-heyl-modal/demo/node_modules/ngx-heyl-snackbar/node_modules/@angular/core/src/metadata/ng_module.d.ts, resolving symbol NgModule in D:/GitHub/angular-npm/ngx-heyl-modal/demo/node_modules/ngx-heyl-snackbar/node_modules/@angular/core/src/metadata.d.ts, resolving symbol NgModule in D:/GitHub/angular-npm/ngx-heyl-modal/demo/node_modules/ngx-heyl-snackbar/node_modules/@angular/core/src/core.d.ts, resolving symbol NgModule in D:/GitHub/angular-npm/ngx-heyl-modal/demo/node_modules/ngx-heyl-snackbar/node_modules/@angular/core/index.d.ts, resolving symbol SnackbarModule in D:/GitHub/angular-npm/ngx-heyl-modal/demo/node_modules/ngx-heyl-snackbar/index.ts, resolving symbol SnackbarModule in D:/GitHub/angular-npm/ngx-heyl-modal/demo/node_modules/ngx-heyl-snackbar/index.ts

my packages : (With all my sources on Git)

https://www.npmjs.com/package/ngx-heyl-modal

https://www.npmjs.com/package/ngx-heyl-snackbar

EDIT :

I tried to use npm link with a simple project : empty service, empty component (just a div in the html file, no input no functions at all) and this issue is still here. I think it's because of the NgModule, maybe I'm wrong in how I wrote it ? or my package.json ?

Upvotes: 3

Views: 235

Answers (1)

yurzui
yurzui

Reputation: 214275

You should not ship node_modules folder in your package.

You must keep in mind that you’re writing library for Angular project. Since project itself must have Angular core as a dependency the library should not include Angular sources in the bundles it produces. To do so you need to setup peer dependencies in package.json file.

{
  ...  
  "peerDependencies": {
    "@angular/common": "^4.0.0",
    "@angular/core": "^4.0.0"
  }
  ...
}

Simple way to create AOT compatible angular library is just to run ngc but i would advice you to follow Angular 4 package format

Here is my test library https://www.npmjs.com/package/@zuz/lib (source, peerDependencies in package.json)

See also these links for possible solutions

Upvotes: 3

Related Questions