I've been working on an Angular app for a couple months now, and recently I started seeing a condition where the app piles without errors, but when it reloads in Chrome there's just a blank screen. Also, no errors in the console. When I look at the markup, I can see the tag for my root ponent, but nothing else renders. I'm fairly certain I should NOT see the tag for the root ponent, but rather the rendered HTML, right? So it loads index.html, then craps out without any indication of what the issue could be. I have been attempting to move my ponents out of app.module and into feature modules to clean things up, but when I reverse those changes I still can't get the app to load. I've tried stopping and restarting the live dev server, but still no joy.

I'd post code here, but there's a ton of code in this app, and I don't know where the problem is. Why would Angular refuse to render without any pile or console errors, or any indication of what I can do to fix this?? If anyone has any idea where I can start to look, I'll be happy to post code.

FYI, I'm using Angular CLI 7.2.3, Angular 7.2.2. I'm developing in Visual Studio Code with the latest updates on a Windows 10 machine. I should also say that this has happened a few times during development, but I was always able to figure out what was causing the problem.

I've been working on an Angular app for a couple months now, and recently I started seeing a condition where the app piles without errors, but when it reloads in Chrome there's just a blank screen. Also, no errors in the console. When I look at the markup, I can see the tag for my root ponent, but nothing else renders. I'm fairly certain I should NOT see the tag for the root ponent, but rather the rendered HTML, right? So it loads index.html, then craps out without any indication of what the issue could be. I have been attempting to move my ponents out of app.module and into feature modules to clean things up, but when I reverse those changes I still can't get the app to load. I've tried stopping and restarting the live dev server, but still no joy.

I'd post code here, but there's a ton of code in this app, and I don't know where the problem is. Why would Angular refuse to render without any pile or console errors, or any indication of what I can do to fix this?? If anyone has any idea where I can start to look, I'll be happy to post code.

FYI, I'm using Angular CLI 7.2.3, Angular 7.2.2. I'm developing in Visual Studio Code with the latest updates on a Windows 10 machine. I should also say that this has happened a few times during development, but I was always able to figure out what was causing the problem.

• javascript
• angular
• debugging

• I had same issues in the past and it was a fault in code when I was also restructuring the project. Every Angular app learning process goes through this process of separating functionalities into different files. So please check your code and changes you are doing very carefully. Secondly, does this issue occur even before you started shifting your code? – MiKr13 Commented Feb 6, 2019 at 16:09
• Thanks - no, it didn't start until I started restructuring the app. I understand there's a learning process, but as a developer, it's difficult to understand how to debug an issue with NO ERRORS indicating where I could even start looking. If I had some clue as to what was causing the issue, I could at least start menting out code to see if that fixed it. But with no errors, all I can do is start a brand new app and start adding ponents and modules into it to see what breaks it. That seems like an inefficient way to debug. Not sure why the Angular team settled on this model...? – Eddie Commented Feb 6, 2019 at 16:44
• I decided to just hard reset back to my last mit and start over with the restructuring of the app. So far that is working well. I'm just doing a mit after every ponent I move so I can roll back if needed. Too bad they don't give us more info to figure this out... – Eddie Commented Feb 6, 2019 at 20:05
• I'll request you to keep this thread updated with your finding of what has failed as it might help people in need after you debug it. Thanks and looking forward to your own answer on this thread. – MiKr13 Commented Feb 13, 2019 at 10:19

1 Answer 1

As requested, here is my answer. It's a bit embarrassing, given that I've been doing web development for over 20 years, but I forgot that I had disabled some options in the Chrome debugger settings. So Angular WAS sending errors when I got the blank screens, I just couldn't see those errors because I had disabled them. Once I reset the options to the default for Chrome, I was able to see all of the errors causing the page not to render. I realized this when I loaded the app in IE Edge and was able to see the errors in the console. I figured if IE is showing me the errors, I must have disabled them in Chrome.