webpack live reload is not working.

[burdzand]

I have installed the webpack but the live reload is not working , it is building the modules and caching it.

Linux 4.4.0-31-generic
node v6.2.2
npm v3.10.5

angular-cli: 1.0.0-beta.11-webpack
node: 6.2.2
os: linux x64

[TheLarkInn]

Are you using the ng serve command or ng build --watch.

Both should work but I ask because we really need more information to accurately tackle this.

[burdzand]

I am using ng serve

[burdzand]

10% building modules 1/1 modules 0 active
*
*
NG Live Development Server is running on http://localhost:4200.
*
4318ms building modules
38ms sealing
0ms optimizing
0ms basic module optimization
16ms module optimization
1ms advanced module optimization
15ms basic chunk optimization
1ms chunk optimization
0ms advanced chunk optimization
0ms module and chunk tree optimization
58ms module reviving
5ms module order optimization
4ms module id optimization
3ms chunk reviving
0ms chunk order optimization
14ms chunk id optimization
26ms hashing
1ms module assets processing
71ms chunk assets processing
2ms additional chunk assets processing
1ms recording
0ms additional asset processing
127ms chunk asset optimization
864ms asset optimization
25ms emitting
Hash: 3eaa2255197a9b5cb5fd
Version: webpack 2.1.0-beta.18
Time: 5607ms
Asset Size Chunks Chunk Names
main.bundle.js 2.18 MB 0, 2 [emitted] main
polyfills.bundle.js 227 kB 1, 2 [emitted] polyfills
inline.js 4.96 kB 2 [emitted] inline
main.map 2.59 MB 0, 2 [emitted] main
polyfills.map 294 kB 1, 2 [emitted] polyfills
inline.map 5.13 kB 2 [emitted] inline
index.html 476 bytes [emitted]
.npmignore 0 bytes [emitted]
Child html-webpack-plugin for "index.html":
Asset Size Chunks Chunk Names
index.html 2.4 kB 0
webpack: bundle is now VALID.

[filipesilva]

I'm seeing the live reload working myself. Can you give very exact repro steps so we can see if there's something missing?

[281330]

I am having the same issue after I cloned a project from my repo.

On my regular machine, I see a lot of something like "69% building modules 1054/1062 modules 8 active ..", etc.

But on my other machine, I only see this -

 ng serve
 10% building modules 1/1 modules 0 active           
*
*
 NG Live Development Server is running on http://localhost:4200.
*
5134ms building modules                                                                   
13ms sealing
0ms optimizing 
0ms basic module optimization 
43ms module optimization
1ms advanced module optimization 
9ms basic chunk optimization        
0ms chunk optimization 
1ms advanced chunk optimization 
0ms module and chunk tree optimization 
89ms module reviving
2ms module order optimization 
3ms module id optimization 
4ms chunk reviving 
0ms chunk order optimization 
19ms chunk id optimization
19ms hashing
0ms module assets processing 
56ms chunk assets processing
3ms additional chunk assets processing 
0ms recording 
0ms additional asset processing 
131ms chunk asset optimization
1059ms asset optimization
22ms emitting
Hash: 101774096aac67c140a7
Version: webpack 2.1.0-beta.18
Time: 6621ms
              Asset       Size  Chunks             Chunk Names
     main.bundle.js    3.75 MB    0, 2  [emitted]  main
polyfills.bundle.js     232 kB    1, 2  [emitted]  polyfills
          inline.js    4.96 kB       2  [emitted]  inline
           main.map    4.42 MB    0, 2  [emitted]  main
      polyfills.map     295 kB    1, 2  [emitted]  polyfills
         inline.map    5.13 kB       2  [emitted]  inline
         index.html  877 bytes          [emitted]  

Child html-webpack-plugin for "index.html":
         Asset     Size  Chunks       Chunk Names
    index.html  2.83 kB       0       
webpack: bundle is now VALID.

Now, when I make any changes to my code, it doesn't reload.

[filipesilva]

If you can provide us with a repo where this behaviour happens, we can investigate. Otherwise I'm not really able to reproduce this behaviour.

[giovapanasiti]

I'm having same issue. My ng version is: angular-cli: 1.0.0-beta.11-webpack.2

ng serve works without live reload and ng build --watch only build the app and then quit without even serving the app on localhost

[osechet]

I'm having the issue for directories starting with '+'. ng serve and ng build -w works normally: they build the application and wait for changes. If I modify a file in a 'normal' directory (i.e. app.component.ts), the change is detected and ng rebuilds. If I modify a file in a directory whose name starts with '+', nothing happens.
However it's working when I use gedit: when gedit saves a file, it creates a backup that triggers the reload. Reloads also works if I manually create a new file.

[osechet]

I renamed my directories to remove the '+' and in fact the problem happens with any subdirectory of app. If I modify anything directly inside src (i.e. index.html, main.ts, ...) reload works. If I modify something in a subdirectory of src (i.e. src/app/app.component.*, src/app/app.module.ts, src/assets, src/environments/environment.ts, ...) reload works as well. But if I modify something in a subdirectory of app (i.e. src/app/foo/foo.component.ts), there is no reload.

I'm on Ubuntu 14.04 and I can reproduce this with any repository. For example:

ng new project
cd project
ng g c foo
ng serve

Then open a browser on the application. Edit app.component.html as follow:

<h1>
  {{title}}
</h1>
<app-foo></app-foo>

Save: ng reloads the app.

Edit foo/foo.component.html as follow:

<p>
  foo works! ng reloads?
</p>

Save: ng does not reload.

@filipesilva Do you confirm you cannot reproduce following these steps?

[FoodBuster]

I had the same issue, but managed to fix it. The problem might have to do with folder naming. At first, my main project folder (where I would navigate to before doing "ng serve") was named something like "XX (Front)". I renamed it to "XX_Front" (and flattened the folder structure) and live reload started working.

[filipesilva]

@osechet I followed your instructions and had a life reload be triggered when changing foo/foo.component.html.

I'm using beta.14 and VSCode as an editor, if that helps. Do you also get this in beta.14?