NativeScript / nativescript-dev-webpack

A package to help with webpacking NativeScript apps.
Apache License 2.0
97 stars 49 forks source link

Hot Module Replacement (HMR) not working correctly, not reflecting changes in component class file #1060

Closed acharyaks90 closed 4 years ago

acharyaks90 commented 5 years ago

Environment

Expected behavior tns debug android should work as tns debug android --no-hmr

davorpeic commented 5 years ago

Having similar issues with IOS, I see hot module file in yellow in console, but entire app restarts but no changes are applied, used --no-hmr flag to get updates right even without hmr. strange

Fatme commented 5 years ago

@acharyaks90, @davorpeic,

It'll be really appreciated if you send us the exact steps so we can reproduce the issue on our side. Also we'll need the content of your package.json file as well.

davorpeic commented 5 years ago

I recently updated from NS 5.4.2

{
  "description": "desc",
  "license": "SEE LICENSE IN <your-license-filename>",
  "readme": "xx",
  "repository": "<fill-your-repository-here>",
  "nativescript": {
    "id": "xxx",
    "tns-android": {
      "version": "6.1.2"
    },
    "tns-ios": {
      "version": "6.1.1"
    }
  },
  "dependencies": {
    "@angular/animations": "~8.2.0",
    "@angular/common": "~8.2.0",
    "@angular/compiler": "~8.2.0",
    "@angular/core": "~8.2.0",
    "@angular/forms": "~8.2.0",
    "@angular/http": "8.0.0-beta.10",
    "@angular/platform-browser": "~8.2.0",
    "@angular/platform-browser-dynamic": "~8.2.0",
    "@angular/router": "~8.2.0",
    "@ngx-translate/core": "^11.0.1",
    "@ngx-translate/http-loader": "^4.0.0",
    "allow-publish": "^1.0.4",
    "angular2-uuid": "^1.1.1",
    "angular5-csv2": "^0.2.6",
    "moment": "^2.24.0",
    "nativescript-angular": "^8.2.1",
    "nativescript-appversion": "^1.4.2",
    "nativescript-checkbox": "^3.0.3",
    "nativescript-email": "^1.5.4",
    "nativescript-feedback": "^1.3.9",
    "nativescript-iqkeyboardmanager": "^1.5.1",
    "nativescript-loading-indicator": "^2.5.2",
    "nativescript-material-icons": "^1.0.3",
    "nativescript-ngx-fonticon": "^4.2.1",
    "nativescript-share-file": "^1.0.6",
    "nativescript-sqlite": "^2.3.3",
    "nativescript-theme-core": "^1.0.6",
    "nativescript-ui-dataform": "^5.1.1",
    "nativescript-ui-listview": "^7.1.0",
    "nativescript-ui-sidedrawer": "^7.0.2",
    "ngx-moment": "^3.4.0",
    "reflect-metadata": "~0.1.13",
    "rxjs": "^6.4.0",
    "tns-core-modules": "^6.1.1",
    "zone.js": "^0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.803.6",
    "@angular/cli": "8.0.0",
    "@angular/compiler-cli": "~8.2.0",
    "@ngtools/webpack": "~8.2.0",
    "babel-traverse": "6.26.0",
    "babel-types": "6.26.0",
    "babylon": "6.18.0",
    "extract-text-webpack-plugin": "~3.0.2",
    "lazy": "1.0.11",
    "nativescript-dev-webpack": "~1.2.0",
    "nativescript-worker-loader": "^0.9.6-next-2019-07-25-105954-01",
    "node-sass": "4.12.0",
    "ts-loader": "^4.5.0",
    "typescript": "~3.5.3"
  }
}
kdagnan commented 5 years ago

Can also confirm I am experiencing similar issues. It will say "refreshed application on XXXX" but nothing happens on screen.

Fatme commented 5 years ago

Hey guys,

We've investigated the problem and were able to reproduce the issue using the following steps:

  1. tns create newNgAapp - select Angular, Sidedrawer
  2. tns run ios
  3. Make a change inside search.component.html (or search.component.ts)

The following text is printed on the console:

CONSOLE INFO file:///app/vendor.js:80079:36: HMR: Checking for updates to the bundle with hmr hash a99b4167b83a7f4aab8b.
CONSOLE INFO file:///app/vendor.js:80079:36: HMR: No Modules Updated.
  1. Navigate to the search page on device

Expected: The changes should be applied on device Actual: No changes are applied on device

  1. If you make a next change inside search component, the change will be applied on device.

Can you confirm that you hit the same issue on your side? If this is not the case, can you describe the exact steps you're executing, so we can reproduce the issue on our side? It'll be appreciated if you send us a demo project demonstrating the behavior.

edrick27 commented 5 years ago

hot reload don't work on TNS 6

nkishor-nsf commented 5 years ago

I am trying... tns debug android should work as tns debug android --no-hmr

nkishor-nsf commented 5 years ago

I am facing same issue on TNS 6

Fatme commented 5 years ago

Hey guys,

@nkishor-nsf : I am facing same issue on TNS 6

We described here how we were able to reproduce the error. It seems as a minor issue as it happens only on first navigation to a lazy loaded route. Most probably it is not the same problem you faced. So, we need more information in order to help you. Without giving us the exact steps or demo project demonstrating the problem, we cannot investigate it further.

Ianc22 commented 4 years ago

bump!

DimitarTachev commented 4 years ago

@Ian22,

As @Fatme has already mentioned, we are not able to reproduce the issue and we are not able to investigate it further. Could you please provide us the exact dependencies' versions and some steps for reproducing the issue?

mhmeluskey commented 4 years ago

Hi @DimitarTachev

I am having the same problem for my nativescript app using v 6.1.0. on a mac. I have a project that used to work fine but all of a sudden the HMR stopped working for a specific project. The hot reload on this project still works for other projects on my mac and my co workers (all non mac users) are still able to have this project working on their computers. I know thats really vague but if i send you the dependencies would you be able to look into it.

DimitarTachev commented 4 years ago

@mhmeluskey,

This is a specific issue for updating lazy modules in Angular apps. I suggest you log another issue following the issue template. Also, the logs from tns run <platform> --log trace will be helpful.

P.S. Before logging the issue, please update the NativeScript CLI and the nativescript-dev-webpack plugin (along with your webpack.config.js file) to the latest versions. You could even check their rc version as we are currently preparing the 6.3.0 release and the issue could be already fixed. (npm i nativescript@rc -g, npm i nativescript-dev-webpack@rc, ./node_modules/.bin/update-ns-webpack --configs).

mhmeluskey commented 4 years ago

@DimitarTachev running npm i nativescript@rc -g, npm i nativescript-dev-webpack@rc, seems to have fixed my problem. Thank you for your help.

timdoege commented 4 years ago

HMR also stopped working suddenly on my Mac (I'm on NS 6.1 + Angular 8.2). Upgrading nativescript-dev-webpack seems to fix this.

DimitarTachev commented 4 years ago

I'm closing this issue as it's not related to the hot updates in Angular lazy routes anymore. For further HMR related issues, please log a new one following the issue template.

fgutteridge commented 4 years ago

For anyone still experiencing this issue, updating nativescript-dev-webpack to v1.3.0 (as @DimitarTachev and @timdoege shared) does indeed fix this issue.

(Edit: scratch that. HMR seemed to work there for a split second after the upgrade, but not anymore.)

I think this issue is worth reopening.

DimitarTachev commented 4 years ago

@fgutteridge, as the recent comments are not related to the initial issue, please follow the issue template and open a new issue with steps to reproduce.