Useful Tools for Angular Upgrade

Photo by Franco Antonio Giovanella on Unsplash

Angular Update Guide

https://update.angular.io/ is a very helpful site that describes the things to do for upgrades between specific versions.

https://update.angular.io/
(node:12364) [DEP0111] DeprecationWarning: Access to process.binding(‘http_parser’) is deprecated

NVM

I use Homebrew on Mac so I followed the steps described here for installation.

nvm install 14
nvm command output
nvm use 14

Madge

We noticed that Typescript has become more strict 😊. We came across “TypeError: Class extends value undefined is not a function or null” error (which was never thrown before) which turned out to be a circular dependency error (StackOverflow link).

npm -g install madge
madge --circular --extensions ts <directory_path>
Madge Output Example

Test Build Error — “Angular JIT Compilation Failed”

When we ran “ng build -c test” command for test build and ran “http-server ./dist” afterwards, we got “Unhandled Promise rejection: Angular JIT compilation failed error” error (StackOverflow link).

  • add below command to your package.json in scripts section.
scripts{
"postinstall": "ngcc --properties es5 browser module main --first-only"
}

npm outdated

While inspecting Angular JIT Compilation error, I thought it would be because of our outdated dependencies in our project (since their compiled output may not be performed with Ivy compiler). That’s why I thought of finding them out as a list. I came across this StackOverflow link as I searched.

npm outdated
npm outdated output

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Nil Seri

Nil Seri

I would love to change the world, but they won’t give me the source code | coding 👩🏼‍💻 | coffee ☕️ | jazz 🎷 | anime 🐲 | books 📚 | drawing 🎨