Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

1.3K
Views
Angular 12 - Uncaught TypeError: Cannot read properties of undefined (reading 'ngModule') at isModuleWithProviders
core.js:27296 Uncaught TypeError: Cannot read properties of undefined (reading 'ngModule')
    at isModuleWithProviders (core.js:27296)
    at expandModuleWithProviders (core.js:27290)
    at Array.map (<anonymous>)
    at Function.get (core.js:26927)
    at getNgModuleDef (core.js:1117)
    at assertNgModuleType (core.js:1296)
    at compileNgModuleFactory__POST_R3__ (core.js:29073)
    at PlatformRef.bootstrapModule (core.js:29324)
    at Module.14431 (main.ts:11)
    at __webpack_require__ (bootstrap:19)

I have a custom library that is consumed by the main project (app). Everything was fine until I updated the project to Angular 12.

I followed the update instructions here, for both the main project and the custom library

There are no compile errors when I serve and no build errors when I build with --prod flag. However, when I try to assess the app locally from the browser I get the above error.

I have tried debugging it. That led me to these solutions, here and here. With those, I was able to trace the error to the modules imported from the custom library. But that's where I'm stuck.

Please, can someone assist with how to fix the error and run the app?

App.module

import { UtilsModule } from '@utils/utils.module';
import { PipesModule } from '@pipes/pipes.module';

...

@NgModule({
    imports: [
        BrowserModule,
    ...
        PipesModule,
        UtilsModule
    ]
})

tsconfig.json

{
"paths": {
      ...
      "@pipes/*": [
        "./node_modules/custom-library/src/pipes/*"
      ],
      "@utils/*": [
        "./node_modules/custom-library/src/utils/*"
      ],
     ...
   }
 ...
 }

package.json

{
 ...
 "dependencies": {
     ...
     "custom-library": "url-to-repository-branch"
     ...
   }
 ...
}

The library was installed with this approach here

over 4 years ago · Santiago Trujillo
1 answers
Answer question

0

I have spent the whole day looking for a solution to your problem(which was also my). Lets see if what I've found helps you.

Explaining the problem:

I have several non-published angular libraries and I want to use them in a project we are developing.

During the development phase, everything was fine (I Used tsconfig.json for configuring the path for the libraries). Yet, on deploy, that information was lost.

The solution was:

  • Create a build from the libraries (npm build PROJECT_LIBRARY)
  • Create a package from that new folder (npm package ./FOLDER_OF_BUILT_LIBRARY)
    • It's important that the package must be done from the BUILT Library and not the original code
  • Npm Install that library, based on a file:
    • "library-to-import"file:/./tmp/library-to-import.0.0.1.tgz"

And after that, use normally. I got it working (using angular v12)

over 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!