HMR not working

[kuseku]

Hello ,

I just pulled latest code and ran the web site. Everything seems to work but HMR. Any pointers ? No changes made, I verified the Hosting Environment and it is "Development" .

[isaacrlevin]

What happens when you save a page when the app is running? Does the Command Window say webpack building?

[kuseku]

No nothing. I have used HMR in the past , I have an idea of how it works. But I am running out options in this case. So was wondering if anyone else is having similar issue.

[isaacrlevin]

I just pulled a clean version and have HMR working. Do you get any errors on the console? Or messages at all? I sometimes see that the hot.json file doesn't get downloaded, but doing a hard refresh fixes it

[MarkPieszak]

@kuseku Are you using VSCode or VS?
Make sure you set that end variable to ASPNETCORE_ENVIRONMENT=Development in command line (when in the project root level).

[kuseku]

@MarkPieszak @isaac2004 : 1. Yes I have Development Flag set and I could see it is setting HMR enabled options.

I see following error : when I request the Page. I tried searching but No luck yet on fixing it , because it did case any other problem I left it. Now I am thinking this is causing HMR to fail is it ?

Additionally I disabled SSR. Have this code for debugging, I never see Test-main browser App comment.

`console.log('test-main browser');
// // Enable either Hot Module Reloading or production mode

if (module['hot']) {

    module['hot'].accept();

    module['hot'].dispose(() => {

        console.log('test-main browser App');

        modulePromise.then(appModule => appModule.destroy());

    });

} else {

    enableProdMode();

}`

fail: Microsoft.AspNetCore.NodeServices[0] Error: No module factory available for dependency type: ContextElementDepe ndency at Compilation.addModuleDependencies (C:\Users\senthilk\node_modules\w ebpack\lib\Compilation.js:210:21) at Compilation.processModuleDependencies (C:\Users\senthilk\node_modul es\webpack\lib\Compilation.js:199:8) at _this.buildModule.err (C:\Users\senthilk\node_modules\webpack\lib\C ompilation.js:340:13) at building.forEach.cb (C:\Users\senthilk\node_modules\webpack\lib\Com pilation.js:144:27) at Array.forEach (native) at callback (C:\Users\senthilk\node_modules\webpack\lib\Compilation.js :144:13) at module.build (C:\Users\senthilk\node_modules\webpack\lib\Compilatio n.js:171:11) at resolveDependencies (C:\Users\senthilk\node_modules\webpack\lib\Con textModule.js:133:4) at ContextModule.result.resolveDependencies (c:\Senthil\Personal\Kusek \SM\aspnetcore-angular2-universal\node_modules\@ngtools\webpack\src\plugin.js:24 9:25) at ContextModule.build (C:\Users\senthilk\node_modules\webpack\lib\Con textModule.js:103:8) fail: Microsoft.AspNetCore.NodeServices[0] C:\Users\senthilk\node_modules\webpack\lib\Compilation.js:269 fail: Microsoft.AspNetCore.NodeServices[0] if(_this.profile) { fail: Microsoft.AspNetCore.NodeServices[0] ^ fail: Microsoft.AspNetCore.NodeServices[0] TypeError: Cannot read property 'profile' of null fail: Microsoft.AspNetCore.NodeServices[0] at factoryCallback (C:\Users\senthilk\node_modules\webpack\lib\Compila tion.js:269:13) fail: Microsoft.AspNetCore.NodeServices[0] at factory (C:\Users\senthilk\node_modules\webpack\lib\NormalModuleFac tory.js:253:5) fail: Microsoft.AspNetCore.NodeServices[0] at applyPluginsAsyncWaterfall (C:\Users\senthilk\node_modules\webpack\ lib\NormalModuleFactory.js:99:14) fail: Microsoft.AspNetCore.NodeServices[0] at C:\Users\senthilk\node_modules\webpack\node_modules\tapable\lib\Tap able.js:204:11 fail: Microsoft.AspNetCore.NodeServices[0] at NormalModuleFactory.params.normalModuleFactory.plugin (C:\Users\sen thilk\node_modules\webpack\lib\CompatibilityPlugin.js:52:5) fail: Microsoft.AspNetCore.NodeServices[0] at NormalModuleFactory.applyPluginsAsyncWaterfall (C:\Users\senthilk\n ode_modules\webpack\node_modules\tapable\lib\Tapable.js:208:13) fail: Microsoft.AspNetCore.NodeServices[0] at resolver (C:\Users\senthilk\node_modules\webpack\lib\NormalModuleFa ctory.js:74:11) fail: Microsoft.AspNetCore.NodeServices[0] at process.nextTick (C:\Users\senthilk\node_modules\webpack\lib\Normal ModuleFactory.js:205:8) fail: Microsoft.AspNetCore.NodeServices[0] at _combinedTickCallback (internal/process/next_tick.js:73:7) fail: Microsoft.AspNetCore.NodeServices[0] at process._tickCallback (internal/process/next_tick.js:104:9)

[isaacrlevin]

Were you able to resolve this?

[kuseku]

@isaac2004 nope, It is still same.. Refer to my latest comment,, I get above error during build and code wont hit HMR enabled logic.. My doubt is about version conflict not sure which version is causing the issue tough.

[isaacrlevin]

can you do a fresh pull and try again without changing anything? What version of node do you have installed? is webpack installed globally?

[yanbu0]

I have the same issue with HMR. First noticed it when I upgraded my project to .Net Core 2.0. Just pulled down this repo to see if it was a bug i introduced, and have same issue with fresh copy of the code. The error I see is:

What appears to be happening is the routing is picking up the call to __webpack_hmr and, not finding a valid route for that, is defaulting back to /Home/Index, which returns html.

This seems to be a .net core 2.0 thing, there is some difference in how it is handling the get request.

[e-davidson]

@yanbu0
Try this.
aspnet/JavaScriptServices#1204 (comment)

[yanbu0]

DUDE! That fixes it! Thanks for the link.

[jdimov]

I also have problem with HMR. It looks that everything is ok but it doesn't change the page content:
Node will restart because file changed: D:\Projects\TFS\testprojects\aspnetcore-angular2-universal\Client\app\components\navmenu\navmenu.component.html
info: Microsoft.AspNetCore.NodeServices[0]
webpack built 81bafb575a69580f39d8 in 56792ms
info: Microsoft.AspNetCore.NodeServices[0]
webpack building...
info: Microsoft.AspNetCore.NodeServices[0]
webpack built a56291755985b9363472 in 16329ms
info: Microsoft.AspNetCore.NodeServices[0]
webpack building...
info: Microsoft.AspNetCore.NodeServices[0]
webpack built a56291755985b9363472 in 299ms

Also in log I can see one fail state but the error is just warning and may be is not related to HMR problem:
fail: Microsoft.AspNetCore.NodeServices[0]
Template parse warnings:
The element is deprecated. Use instead ("
[WARNING ->]<template [ngIf]="!isClosed">
<div [class]="'alert alert-' + type" role="alert" [ngClass]="classes""): ng:///AlertModule/AlertComponent.html@1:0

[isaacrlevin]

The template error is because of ngx-bootstrap. If you search that error in those issue list there will be a fix for it.

[MarkPieszak]

HMR should be fine now as of #376 ! @kuseku