Description
Environment
tns info:
√ Component nativescript has 7.0.6 version and is up to date.
√ Component @nativescript/core has 7.0.0 version and is up to date.
× Component @nativescript/ios is not installed.
√ Component @nativescript/android has 7.0.0 version and is up to date.
package.json
{
"name": "@nativescript/template-hello-world-ng",
"main": "main.js",
"version": "7.0.2",
"author": "NativeScript Team oss@nativescript.org",
"description": "NativeScript Application",
"license": "SEE LICENSE IN ",
"publishConfig": {
"access": "public"
},
"keywords": [
"nativescript",
"mobile",
"angular",
"{N}",
"template"
],
"repository": "",
"bugs": {
"url": "https://github.com/NativeScript/NativeScript/issues"
},
"scripts": {
"ngcc": "ngcc --properties es2015 module main --first-only",
"postinstall": "npm run ngcc"
},
"dependencies": {
"@angular/animations": "~10.1.0",
"@angular/common": "~10.1.0",
"@angular/compiler": "~10.1.0",
"@angular/core": "~10.1.0",
"@angular/forms": "~10.1.0",
"@angular/platform-browser": "~10.1.0",
"@angular/platform-browser-dynamic": "~10.1.0",
"@angular/router": "~10.1.0",
"@nativescript/angular": "~10.1.0",
"@nativescript/core": "~7.0.0",
"@nativescript/theme": "~2.3.0",
"reflect-metadata": "~0.1.12",
"rxjs": "^6.6.0",
"zone.js": "~0.11.1"
},
"devDependencies": {
"@angular/compiler-cli": "~10.1.0",
"@nativescript/android": "7.0.0",
"@nativescript/types": "~7.0.0",
"@nativescript/webpack": "~3.0.0",
"@ngtools/webpack": "~10.1.0",
"typescript": "~3.9.0"
},
"private": "true",
"readme": "NativeScript Application"
}
Describe the bug
HMR not working on Android (IOS not tested). No error reported, but application screen is blanked.
To Reproduce
create a sample application with angular and Hello world template :
nsc create sampleapp
build and launch application:
tns debug android --watch
The application is built and displayed on device (emulator)
Now modify file [src\app\item\items.component.html] changing, for example, the ActionBar title
The change is detected, but when hot updates are applied the app screen is blanked.
This is the output (no errors):
File change detected. Starting incremental webpack compilation...
Hash: bd62e71f13914cafaf7a
Version: webpack 4.44.1
Time: 496ms
Built at: 2020-09-08 14:24:47
Asset Size Chunks Chunk Names
792ff4769056012fc631.hot-update.json 48 bytes [emitted] [immutable] [hmr]
bundle.792ff4769056012fc631.hot-update.js 7.24 KiB bundle [emitted] [immutable] [hmr] bundle
bundle.js 44.8 KiB bundle [emitted] bundle
runtime.js 77.1 KiB runtime [emitted] runtime
- 1 hidden asset
Entrypoint bundle = runtime.js vendor.js bundle.js bundle.792ff4769056012fc631.hot-update.js
[../$$_lazy_route_resource lazy recursive] ../$$_lazy_route_resource lazy namespace object 160 bytes {bundle} [built]
[./app/item/items.component.ts] 1.92 KiB {bundle} [built]- 555 hidden modules
Webpack compilation complete. Watching for file changes.
Webpack build done!
Successfully transferred bundle.792ff4769056012fc631.hot-update.js on device emulator-5554.
Successfully transferred 792ff4769056012fc631.hot-update.json on device emulator-5554.
JS: HMR: Checking for updates to the bundle with hmr hash 792ff4769056012fc631.
JS: HMR: The following modules were updated:
JS: HMR: ↻ ./app/item/items.component.ts
JS: HMR: ↻ ./app/app-routing.module.ts
JS: HMR: ↻ ./app/app.module.ts
JS: HMR: Successfully applied update with hmr hash 792ff4769056012fc631. App is up to date.
Refreshing application on device emulator-5554...
JS: Angular is running in development mode. Call enableProdMode() to enable production mode.
device: emulator-5554 debug port: 40000
- 555 hidden modules
To start debugging, open the following URL in Chrome:
devtools://devtools/bundled/inspector.html?ws=localhost:40000
Successfully synced application org.nativescript.sampleapp on device emulator-5554.
Expected behavior
HMR working as in previous release