Skip to content

Angular 10, HMR not working with fonts #2244

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
ptomasini opened this issue Sep 8, 2020 · 0 comments
Open

Angular 10, HMR not working with fonts #2244

ptomasini opened this issue Sep 8, 2020 · 0 comments

Comments

@ptomasini
Copy link

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

add some fonts in folder [src/fonts]

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 the application is restarted and not live-updates.

The strange behaviour is that all fonts are always transferred to the device:

File change detected. Starting incremental webpack compilation...
Hash: 9dcdd6cb8a8826b360cc
Version: webpack 4.44.1
Time: 441ms
Built at: 2020-09-08 14:48:22
Asset Size Chunks Chunk Names
acf5af587de32a59b1d4.hot-update.json 48 bytes [emitted] [immutable] [hmr]
bundle.acf5af587de32a59b1d4.hot-update.js 7.24 KiB bundle [emitted] [immutable] [hmr] bundle
bundle.js 44.8 KiB bundle [emitted] bundle
fonts/fa-brands-400.ttf 131 KiB [emitted]
fonts/fa-regular-400.ttf 33.3 KiB [emitted]
fonts/fa-solid-900.ttf 199 KiB [emitted]
runtime.js 77.1 KiB runtime [emitted] runtime

  • 1 hidden asset
    Entrypoint bundle = runtime.js vendor.js bundle.js bundle.acf5af587de32a59b1d4.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.js on device emulator-5554.
      Successfully transferred runtime.js on device emulator-5554.
      Successfully transferred vendor.js on device emulator-5554.
      Successfully transferred fa-brands-400.ttf on device emulator-5554.
      Successfully transferred fa-regular-400.ttf on device emulator-5554.
      Successfully transferred fa-solid-900.ttf on device emulator-5554.
      Restarting application on device emulator-5554...
      device: emulator-5554 debug port: 40000

To start debugging, open the following URL in Chrome:
devtools://devtools/bundled/inspector.html?ws=localhost:40000

JS: HMR: Hot Module Replacement Enabled. Waiting for signal.
JS: Angular is running in development mode. Call enableProdMode() to enable production mode.
Successfully synced application org.nativescript.sampleapp2 on device emulator-5554.

Expected behavior
HMR working as in previous release, no font's file transferred when changed other parts of application

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant