Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular 8: "Please add a @NgModule annotation" when including a library into another library

I want to use one of my shared libraries in another shared library, but I am getting

ERROR: Unexpected value 'LibraryModule in ...' imported by the module 'TestlibModule in ...'. Please add a @NgModule annotation.

The libraries are in separate angular apps (test and test2). Each app contains one library (generated through ng generate library) which I build by running ng build library_name

a library in the test app (called testlib) includes the library from test2 (called library) through npm

package.json:

...
"dependencies": {
  "@angular/animations": "~8.2.14",
  ...
  "library": "file:../../test2/test2/dist/library"
},

testlib.module.ts

import { NgModule } from '@angular/core';
import { TestlibComponent } from './testlib.component';
import { LibraryModule } from 'library';

@NgModule({
  declarations: [TestlibComponent],
  imports: [
    LibraryModule
  ],
  exports: [TestlibComponent]
})
export class TestlibModule { }

tsconfig.lib.json in the included library

{
  "extends": "../../tsconfig.json",
  "compilerOptions": {
    "outDir": "../../out-tsc/lib",
    "target": "es2015",
    "declaration": true,
    "inlineSources": true,
    "types": [],
    "lib": [
      "dom",
      "es2018"
    ]
  },
  "angularCompilerOptions": {
    "annotateForClosureCompiler": true,
    "skipTemplateCodegen": true,
    "strictMetadataEmit": true,
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true,
    "enableResourceInlining": true
  },
  "exclude": [
    "src/test.ts",
    "**/*.spec.ts"
  ]
}

LibraryModule can be included without any problems into an application, but it crashes with the mentioned error when included into a library. I cannot find out what I am doing wrong. Can anyone point me in the right direction?

like image 974
Jakub Judas Avatar asked Jan 22 '26 23:01

Jakub Judas


1 Answers

I found one more solution:

In your library project (testlib) where you import your module TestlibModule from your library set

"fullTemplateTypeCheck": false, in angularCompilerOptions

So, update tsconfig.lib.json file for testlib project with this

"angularCompilerOptions": {
      ...
      "fullTemplateTypeCheck": false,
      ...
}

Now both libraries are building fine and you can import them in any app as well

like image 195
Alex V Avatar answered Jan 25 '26 15:01

Alex V



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!