PatrickJS / angular-hmr

:fire: Angular Hot Module Replacement for Hot Module Reloading
https://patrickjs.com
Apache License 2.0
505 stars 46 forks source link

seed points to an invalid repository #71

Open rburgst opened 6 years ago

rburgst commented 6 years ago
  1. it seems that https://github.com/AngularClass/angular-seed no longer contains the angular seed project, but now is a vue.js repo.
  2. the information in the readme contradicts somewhat to what is stated here https://github.com/angular/angular-cli/wiki/stories-configure-hmr
    • the info in the readme seems to be somewhat outdated.
  3. my component state is lost when working with the description in https://github.com/angular/angular-cli/wiki/stories-configure-hmr

From looking at the video, it is suggested that the component state should be maintained. However when using a trivial example

import { Component } from '@angular/core';
import {HmrState} from 'angular2-hmr';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app works!';
  @HmrState counter = 0;

  increment() {
    this.counter = this.counter + 1;
    return false;
  }
}

and I change anything in app.component.html then the counter is reset to 0 after saving.

So a) is the info in https://github.com/angular/angular-cli/wiki/stories-configure-hmr wrong? b) should the component state be maintained automatically? c) it would help if the seed project still existed

peterkrieg commented 6 years ago

Also wondering this - any idea where a current working example repo of angular-hmr in action is?

artemzakharov commented 6 years ago

I haven't found any repos, but there are a few guides floating around, and it seems like this lib hasn't changed in a while because many of them still work. Here's the one I always refer to:

https://medium.com/@beeman/tutorial-enable-hmr-in-angular-cli-apps-1b0d13b80130

The original directions seem to be based on a webpack when I imagine most of us use CLI now, which is what this guide is geared towards.

rburgst commented 6 years ago

The linked article and repo still have the problem that HMR is not properly enabled, it leaves this

NOTICE Hot Module Replacement (HMR) is enabled for the dev server.
  The project will still live reload when HMR is enabled,
  but to take advantage of HMR additional application code is required
  (not included in an Angular CLI project by default).
  See https://webpack.js.org/guides/hot-module-replacement
  for information on working with HMR for Webpack.

when you start the server. See also https://github.com/beeman/tutorial-angular-cli-hmr/issues/4#issuecomment-328303129

ermcgrat commented 6 years ago

Yeah, this seed project would be really helpful. I'd love to see how they are maintaining state for the components. From my understanding, you can really only hotload your entire module, not just individual components/directives/services. Is this correct? I haven't been able to find, or think of a way how to hotload just a component without loading the whole module.