TypeError: angularCompiler.getNextProgram is not a function

Question

I'm using angular 11.2 in my machine and I want to run a angular 12 project. After clone from git, I ran below commands.

1. npm install
2. ng serve

But I got below errors and can't run the project. I read this question but it not worked for me.

Error: ./src/main.ts
Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js):
TypeError: angularCompiler.getNextProgram is not a function
    at C:\Users\thimira_p\Desktop\itrd\epic-itrda-web\node_modules\@ngtools\webpack\src\ivy\plugin.js:376:100
    at processTicksAndRejections (internal/process/task_queues.js:93:5)

Error: ./src/polyfills.ts
Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js):
TypeError: angularCompiler.getNextProgram is not a function
    at C:\Users\thimira_p\Desktop\itrd\epic-itrda-web\node_modules\@ngtools\webpack\src\ivy\plugin.js:376:100
    at processTicksAndRejections (internal/process/task_queues.js:93:5)

Error: (webpack)-dev-server/client?http://0.0.0.0:0&sockPath=/sockjs-node
Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js):
TypeError: angularCompiler.getNextProgram is not a function
    at C:\Users\thimira_p\Desktop\itrd\epic-itrda-web\node_modules\@ngtools\webpack\src\ivy\plugin.js:376:100
    at processTicksAndRejections (internal/process/task_queues.js:93:5)

How to fix this issue?

Answer 1

I had the same problem in an Angular app which uses a custom webpack.config - having @angular-builders/custom-webpack as a dependency.

Angular and @angular-builders major versions should match.

Solved by updating @angular-builders/custom-webpack to the latest version:

npm install @angular-builders/custom-webpack@^12.0.0

---

If, after doing the installation, you get an error like: An unhandled exception occurred: Cannot find module 'webpack', try removing package-lock.json and node_modules and doing a clean install.

---

Github issue: https://github.com/just-jeb/angular-builders/issues/981

Answer 2

Upgrade from @angular-devkit/[email protected] to @angular-devkit/build-angular@12

Answer 3

Try to remove

"aot": true

from angular.json

Answer 4

I'm still seen this error on @angular/[email protected]

The simple solution is to upgrade @angular-devkit/[email protected] to @angular-devkit/[email protected].

The main point is to replace @angular-devkit/[email protected] with @angular-devkit/build-angular@whatever_version_of_angular_you_have_installed in package.json. After that delete "node_modules" folder and do "npm install"