I recently upgraded my project from angular 7 to angular 8. My project is a combination of angular JS and angular 8. After changing the routing way in the app-routing.module.ts from the #Modulename to ()=> .then() format for load children, I am unable to route to the require module in any deploying environment. Everything works fine in local development environment but as I deploy the code to any higher-level environment the routing doesn't work. The URL goes back to the initial page I was on. When trying to access any other page or route it throws the below error enter image description here
I added individual routing modules to the modules used in the app-routing and also tried a solution by updating the module value to 'esnext' in the tsconfig.e2e.js file. After this change I see an index.html being appended to the URL in the higher environments. the routing seems to work but the index.html is not being removed automatically. I tried adding $locationprovider.hasprefix() and $locationprovider.htmlmode5(true) in the web.config file but it did not work.
Could anyone please suggest on how to go about this issue on either to fix the index.html from the URL or on how to handle the routing error.