ng serve not pushing changes to browser in Angular 10.1.0 with --project usage

[lonerzzz]

🐞 Bug report

Command (mark with an x)

• new
• build
• serve
• test
• e2e
• generate
• add
• update
• lint
• xi18n
• run
• config
• help
• version
• doc

Is this a regression?

I believe that an angular 9.1.x version (not sure which) worked, but numerous changes have been made.

Description

When I run 'ng serve --project ' or 'ng serve --prod --project ' commands, the code is compiled but not pushed to the browser. The running code is the same code as prior to the build.

The same issue also occurs when I change code. After the code is changed, the 'ng serve' command detects the changes and recompiles but no changes are pushed to the browser.

To see if the error was transient, I have done the following with limited success:

1. forced a reload (ctrl-f5) of the web page (did not work)
2. restarted the browser (did not work)
3. toggled the 'Disable cache' option under the Network view in Devtools in case caching was issue(did not work)
4. Ran 'ng serve' from a newly created project that is not in a subdirectory (works)

Thus, it looks like the current revision of the tool does not work with projects structured in subdirectories, but without error output, it is hard to determine exactly what is happening.

🔬 Minimal Reproduction

I am unable to create a repo to reproduce as this is a fundamental tool issue. The tool does not indicate when it is pushing code or if it has encountered an error. The tool should indicate when it is pushing code or if encounters errors that prevent pushing the code.

🔥 Exception or Error

No error occurs, no output is generated.

🌍 Your Environment

Angular CLI: 10.1.0
Node: 10.13.0
OS: win32 x64

Angular: 10.1.0
... animations, cli, common, compiler, compiler-cli, core
... elements, forms, language-service, localize
... platform-browser, platform-browser-dynamic, router
Ivy Workspace: Yes

Package Version

@angular-devkit/architect 0.1001.0
@angular-devkit/build-angular 0.1001.0
@angular-devkit/build-ng-packagr 0.1001.0
@angular-devkit/build-optimizer 0.1001.0
@angular-devkit/build-webpack 0.1001.0
@angular-devkit/core 10.1.0
@angular-devkit/schematics 10.1.0
@ngtools/webpack 10.1.0
@schematics/angular 10.1.0
@schematics/update 0.1001.0
ng-packagr 10.1.0
rxjs 6.6.3
typescript 4.0.2
webpack 4.44.1

Anything else relevant?
No

[alan-agius4]

Hi @lonerzzz,

Thanks for reporting this issue, however without a reproduction it's hard to tell what is happening, which errors are not reported, if it's an OS specific issue etc...

Also, does this happen for all type of changes?, IE when modifying a .css,.html and .ts file.

You can read here why this is needed. A good way to make a minimal repro is to create a new app via ng new repro-app and adding the minimum possible code to show the problem. Then you can push this repository to github and link it here.

[lonerzzz]

I understand that the problem is hard to reproduce. However, the real issue here is not the need for a reproduction, the issue is that the ng tool is not describing what it is doing to even check for deltas in operation between two scenarios. I cannot provide my entire setup and I would have to spend many more hours of trial and error to create a repo that has the exact characteristics that cause the failure .That is not really viable.

Is there no end user visible debug mode for the tool to provide details of what it is doing? If not, one should be added for situations like this. I tried running with --build-event-log and all that it contained was the following with each entry in the log arising from a change made to a file in my code repo proving only that change detection was happening:

{"id":{"started":{}},"started":{"command":"serve","start_time_millis":1599667857078}}
{"id":{"finished":{}},"finished":{"finish_time_millis":1599667887943,"exit_code":{"code":0}}}
{"id":{"started":{}},"started":{"command":"serve","start_time_millis":1599667923843}}
{"id":{"finished":{}},"finished":{"finish_time_millis":1599667923844,"exit_code":{"code":0}}}

I saw that people have requested a debug node for the ng tool previously (#5030).

I also confirmed that changes to any .css, .html or .ts file resulted in builds being performed but no changes being pushed to the browser.

[alan-agius4]

Hi @loganmzz, under the hood Angular CLI uses Webpack, while there is a way to print debugging information the logs are very limiting because most of Webpack's plugins don't use this logger infrastructure.

I have created a PR to print more verbose output when running ng serve --verbose. #18749,, that said, I doubt that you will find any extra logs useful in the issue you are experiencing.

[lonerzzz]

@alan-agius4 Thanks for the PR. I launched 'ng serve' with the node debugger and in the webpack configuration enabled 'trace' level output. I agree that the logging is sparse even in trace mode, but it pointed me in the direction of some areas to investigate. Even some logging is often more helpful than none. I continue to investigate.

[alan-agius4]

@lonerzzz, if you need any assistance let me know.

[alan-agius4]

@lonerzzz, is there anything that we can take action related to this issue? Thanks.

[alan-agius4]

I'm sorry, but we can't reproduce the problem following the instructions you provided.
Remember that we have a large number of issues to resolve, and have only a limited amount of time to reproduce your issue.
Short, explicit instructions make it much more likely we'll be able to reproduce the problem so we can fix it.

If the problem persists, please open a new issue following our submission guidelines.

A good way to make a minimal repro is to create a new app via ng new repro-app and add the minimum possible code to show the problem. Then you can push this repository to github and link it here.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}