How to restore an Angular application code with dist folder

This is going to be a very small blog post, but indeed it will be helpful for lot of Angular developers out there. One of the recent question i answered on Stack overflow on how to reverse engineer an Angular application.

The question was ” I built an Angular app using ng build. I have the built version but I accidently deleted my code. Is there any way I can get my code back from my build version? ”

Even though the correct answer is NO, but you will be able to retrieve 80% of the code with the following steps.

Step 1: Deploy the app code in the Dist folder

Step 2: Use Google Chrome Developer tools (F12).

Step 3: Under debugger tab, look under Webpack -> Src you will see all typescript files. you can copy and past the code provided which would help you to at least build the structure of your application.

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.