Angular build error - Class static blocks are not supported yet

Question

I am trying to do a production build of an application that was upgraded from Angular 8 to Angular 12. I am getting the following error when I try to build for production. How do I fix this?

Error: Optimization error [polyfills-es2015.b56008bea0cb81a74f51.js]: Error: Transform failed with 1 error:
polyfills-es2015.b56008bea0cb81a74f51.js:68:15: error: Class static blocks are not supported yet
    at failureErrorWithLog (/Users/shafkhan/Documents/MBiz/cms-management-web/user-management-web/node_modules/esbuild/lib/main.js:1493:15)
    at /Users/shafkhan/Documents/MBiz/cms-management-web/user-management-web/node_modules/esbuild/lib/main.js:1282:29
    at /Users/shafkhan/Documents/MBiz/cms-management-web/user-management-web/node_modules/esbuild/lib/main.js:629:9
    at handleIncomingPacket (/Users/shafkhan/Documents/MBiz/cms-management-web/user-management-web/node_modules/esbuild/lib/main.js:726:9)
    at Socket.readFromStdout (/Users/shafkhan/Documents/MBiz/cms-management-web/user-management-web/node_modules/esbuild/lib/main.js:596:7)
    at Socket.emit (node:events:513:28)
    at addChunk (node:internal/streams/readable:315:12)
    at readableAddChunk (node:internal/streams/readable:289:9)
    at Socket.Readable.push (node:internal/streams/readable:228:10)
    at Pipe.onStreamRead (node:internal/stream_base_commons:190:23)

Error: Optimization error [polyfills-es5.566af3cf92b3657f00ee.js]: Error: Transform failed with 1 error:
polyfills-es5.566af3cf92b3657f00ee.js:1793:15: error: Class static blocks are not supported yet
    at failureErrorWithLog (/Users/shafkhan/Documents/MBiz/cms-management-web/user-management-web/node_modules/esbuild/lib/main.js:1493:15)
    at /Users/shafkhan/Documents/MBiz/cms-management-web/user-management-web/node_modules/esbuild/lib/main.js:1282:29
    at /Users/shafkhan/Documents/MBiz/cms-management-web/user-management-web/node_modules/esbuild/lib/main.js:629:9
    at handleIncomingPacket (/Users/shafkhan/Documents/MBiz/cms-management-web/user-management-web/node_modules/esbuild/lib/main.js:726:9)
    at Socket.readFromStdout (/Users/shafkhan/Documents/MBiz/cms-management-web/user-management-web/node_modules/esbuild/lib/main.js:596:7)
    at Socket.emit (node:events:513:28)
    at addChunk (node:internal/streams/readable:315:12)
    at readableAddChunk (node:internal/streams/readable:289:9)
    at Socket.Readable.push (node:internal/streams/readable:228:10)
    at Pipe.onStreamRead (node:internal/stream_base_commons:190:23)

My Angular Version

Angular CLI: 12.2.18
Node: 14.21.3
Package Manager: npm 6.14.18
OS: darwin arm64

Angular: 12.2.17

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1202.18
@angular-devkit/build-angular   12.2.18
@angular-devkit/core            7.3.10
@angular-devkit/schematics      7.3.10
@angular/cli                    12.2.18
@angular/http                   7.2.16
@schematics/angular             12.2.18
rxjs                            6.6.7
typescript                      4.3.5

Answer 1

I guess esBuild version you are having does not have class static block support. I found the issue in their project pull requests. Angular esbuild does not have this fix, you can upgrade Angular to a higher version and hope it fixes the issue, or you can switch the builder to the default builder application since this will not have this issue.

esbuild docs on Angular website