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

Question

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?

Answer 1

Here you have 2 project test and test2. In test and test2 project, you have a library each.

Step to fix the issue:

1. Test2 Project:

   a. npm i

   b. npm build library

   c. Go to the dist folder where you have the library build, then run "npm pack". This will generate a .tgz file. Copy that and paste that in test project. For that, create a folder (called packages), then paste here.

2. Test Project:

   a. In package.json, replace the file path for library as: "library": "file:./packages/library.1.0.0.tgz",

   Here library.1.0.0.tgz is name of the tgz file generated after npm pack. You may rename that.

   b. npm i

   c. npm run build and ng build testLib.

   d. Try running the application, now using ng serve command. Hopefully this works.

Note: The steps you need to follow sequentially.