Skip to content

ng g while tns run do not work properly with hmr #233

New issue
New issue
Open
Open
ng g while tns run do not work properly with hmr#233
Labels
bug
@dtopuzov

Description

@dtopuzov
dtopuzov
opened on Jul 30, 2019

Use Case
Execute tns run and start scaffolding your app with ng g.

Describe the bug
When generate new module and components and try to use them in your app the app crash and do not recover when you do changes to make it working.

To Reproduce

npm i -g nativescript@6
npm i -g @nativescript/schematics@next
ng new --collection=@nativescript/schematics TestApp --shared --skip-install
cd TestApp
npm i @nativescript/schematics@next --save-dev --save-exact
tns run android
ng g m module-test
ng g c module-test/component-test

##### REPLACE FILE CONTENT #####
File: TestApp\src\app\app.module.tns.ts
Old String: import { HomeComponent } from '@src/app/home/home.component';
New String: import { ComponentTestComponent } from '@src/app/module-test/component-test/component-test.component';

##### REPLACE FILE CONTENT #####
File: TestApp\src\app\app.module.tns.ts
Old String: HomeComponent,
New String: ComponentTestComponent,

##### REPLACE FILE CONTENT #####
File: TestApp\src\app\app.routes.ts
Old String: import { HomeComponent } from '@src/app/home/home.component';
New String: import { ComponentTestComponent } from '@src/app/module-test/component-test/component-test.component';

##### REPLACE FILE CONTENT #####
File: TestApp\src\app\app.routes.ts
Old String: HomeComponent
New String: ComponentTestComponent

Log of tns run:

/home/nsbuilduser/workspace/master-schematics-e2e-linux/node_modules/.bin/tns run android --path TestApp --emulator
====>
Searching for devices...
Copying template files...
Platform android successfully added. v6.1.0-2019-07-29-182447-01
Preparing project...
File change detected. Starting incremental webpack compilation...

webpack is watching the files…

Hash: 7ccaeb9c5ddc1d63ae0b
Version: webpack 4.30.0
Time: 5506ms
Built at: 07/30/2019 5:21:36 PM
              Asset       Size   Chunks             Chunk Names
          bundle.js   23.3 KiB   bundle  [emitted]  bundle
       package.json  112 bytes           [emitted]  
         runtime.js   71.4 KiB  runtime  [emitted]  runtime
tns-java-classes.js    0 bytes           [emitted]  
          vendor.js   13.2 MiB   vendor  [emitted]  vendor
Entrypoint bundle = runtime.js vendor.js bundle.js
[../$$_lazy_route_resource lazy recursive] ../$$_lazy_route_resource lazy namespace object 160 bytes {bundle} [built]
[./app.css] 448 bytes {bundle} [built]
[./app/app-routing.module.tns.ts] 1.07 KiB {bundle} [built]
[./app/app.component.css] 19 bytes {bundle} [built]
[./app/app.component.html] 64 bytes {bundle} [built]
[./app/app.component.ts] 982 bytes {bundle} [built]
[./app/app.module.tns.ts] 1.69 KiB {bundle} [built]
[./app/app.routes.ts] 243 bytes {bundle} [built]
[./app/home/home.component.css] 19 bytes {bundle} [built]
[./app/home/home.component.html] 273 bytes {bundle} [built]
[./app/home/home.component.ts] 1.27 KiB {bundle} [built]
[./main.tns.ts] 2.37 KiB {bundle} [built]
[./package.json] 104 bytes {bundle} [optional] [built]
    + 420 hidden modules
Webpack compilation complete. Watching for file changes.
Webpack build done!
Project successfully prepared (android)
Building project...
Gradle build...
	 + setting applicationId
	 + applying user-defined configuration from /home/nsbuilduser/workspace/master-schematics-e2e-linux/TestApp/App_Resources/Android/app.gradle
	 + using andorid X library androidx.legacy:legacy-support-v4:1.0.0
	 + adding nativescript runtime package dependency: nativescript-optimized-with-inspector
	 + adding aar plugin dependency: /home/nsbuilduser/workspace/master-schematics-e2e-linux/TestApp/node_modules/tns-core-modules-widgets/platforms/android/widgets-release.aar
Project successfully built.
The build result is located at: /home/nsbuilduser/workspace/master-schematics-e2e-linux/TestApp/platforms/android/app/build/outputs/apk/debug/app-debug.apk
Installing on device emulator-5562...
Successfully installed on device with identifier 'emulator-5562'.
Restarting application on device emulator-5562...
Successfully synced application org.nativescript.TestApp on device emulator-5562.
ActivityManager: Start proc 3073:org.nativescript.TestApp/u0a56 for activity org.nativescript.TestApp/com.tns.NativeScriptActivity
JS: HMR: Hot Module Replacement Enabled. Waiting for signal.
JS: Angular is running in the development mode. Call enableProdMode() to enable the production mode.
[VERIFIED]File change detected. Starting incremental webpack compilation...
Hash: 52b6c59c7101fc270724
Version: webpack 4.30.0
Time: 209ms
Built at: 07/30/2019 5:22:33 PM
                                    Asset      Size   Chunks             Chunk Names
     7ccaeb9c5ddc1d63ae0b.hot-update.json  48 bytes           [emitted]  
bundle.7ccaeb9c5ddc1d63ae0b.hot-update.js   4.8 KiB   bundle  [emitted]  bundle
                                bundle.js  23.1 KiB   bundle  [emitted]  bundle
                               runtime.js  71.4 KiB  runtime  [emitted]  runtime
 + 1 hidden asset
Entrypoint bundle = runtime.js vendor.js bundle.js bundle.7ccaeb9c5ddc1d63ae0b.hot-update.js
[../$$_lazy_route_resource lazy recursive] ../$$_lazy_route_resource lazy namespace object 160 bytes {bundle} [built]
[./app/app.module.tns.ts] 1.63 KiB {bundle} [built]
[./main.tns.ts] 2.37 KiB {bundle} [built]
    + 430 hidden modules
Webpack compilation complete. Watching for file changes.
Webpack build done!
Successfully transferred bundle.7ccaeb9c5ddc1d63ae0b.hot-update.js on device emulator-5562.
Successfully transferred 7ccaeb9c5ddc1d63ae0b.hot-update.json on device emulator-5562.
JS: HMR: Checking for updates to the bundle with hmr hash 7ccaeb9c5ddc1d63ae0b.
JS: HMR: Ignored an error while updating module ./main.tns.ts <accept-errored>
JS: HMR: ReferenceError: HomeComponent is not defined
JS: HMR: Cannot apply update with hmr hash 7ccaeb9c5ddc1d63ae0b.
JS: HMR: HomeComponent is not defined
Refreshing application on device emulator-5562...
File change detected. Starting incremental webpack compilation...
Hash: 0a56fc5a316cba213a88
Version: webpack 4.30.0
Time: 426ms
Built at: 07/30/2019 5:22:34 PM
                               Asset      Size   Chunks             Chunk Names
52b6c59c7101fc270724.hot-update.json  35 bytes           [emitted]  
                           bundle.js  23.1 KiB   bundle  [emitted]  bundle
                          runtime.js  71.4 KiB  runtime  [emitted]  runtime
 + 1 hidden asset
Entrypoint bundle = runtime.js vendor.js bundle.js
[../$$_lazy_route_resource lazy recursive] ../$$_lazy_route_resource lazy namespace object 160 bytes {bundle} [built]
[./app/app-routing.module.tns.ts] 1.07 KiB {bundle} [built]
[./app/app.module.tns.ts] 1.63 KiB {bundle} [built]
[./app/app.routes.ts] 243 bytes {bundle} [built]
[./main.tns.ts] 2.37 KiB {bundle} [built]
    + 428 hidden modules

ERROR in Source file not found: '/home/nsbuilduser/workspace/master-schematics-e2e-linux/TestApp/src/app/app.routes.ts'.
Webpack compilation complete. Watching for file changes.
Webpack build done!
Successfully transferred bundle.js on device emulator-5562.
Successfully transferred runtime.js on device emulator-5562.
Successfully transferred 7ccaeb9c5ddc1d63ae0b.hot-update.json on device emulator-5562.
Restarting application on device emulator-5562...
File change detected. Starting incremental webpack compilation...
Hash: 4abed3f74a77b83714fc
Version: webpack 4.30.0
Time: 166ms
Built at: 07/30/2019 5:22:34 PM
                                    Asset      Size   Chunks             Chunk Names
     0a56fc5a316cba213a88.hot-update.json  48 bytes           [emitted]  
bundle.0a56fc5a316cba213a88.hot-update.js  5.42 KiB   bundle  [emitted]  bundle
                                bundle.js  23.3 KiB   bundle  [emitted]  bundle
                               runtime.js  71.4 KiB  runtime  [emitted]  runtime
 + 1 hidden asset
Entrypoint bundle = runtime.js vendor.js bundle.js bundle.0a56fc5a316cba213a88.hot-update.js
[../$$_lazy_route_resource lazy recursive] ../$$_lazy_route_resource lazy namespace object 160 bytes {bundle} [built]
[./app/app-routing.module.tns.ts] 1.07 KiB {bundle} [built]
[./app/app.routes.ts] 293 bytes {bundle} [built]
[./app/module-test/component-test/component-test.component.css] 69 bytes {bundle} [built]
[./app/module-test/component-test/component-test.component.html] 93 bytes {bundle} [built]
[./app/module-test/component-test/component-test.component.ts] 1.33 KiB {bundle} [built]
    + 427 hidden modules
Webpack compilation complete. Watching for file changes.
Webpack build done!
Successfully synced application org.nativescript.TestApp on device emulator-5562.
ActivityManager: Start proc 3203:org.nativescript.TestApp/u0a56 for activity org.nativescript.TestApp/com.tns.NativeScriptActivity
Successfully transferred 52b6c59c7101fc270724.hot-update.json on device emulator-5562.
Refreshing application on device emulator-5562...
Successfully synced application org.nativescript.TestApp on device emulator-5562.
System.err: An uncaught Exception occurred on "main" thread.
System.err: Unable to create application com.tns.NativeScriptApplication: com.tns.NativeScriptException: Error calling module function 
System.err: ReferenceError: HomeComponent is not defined
System.err: File: "file:///src/app/app.module.tns.ts:18:4
System.err: StackTrace: 
System.err: 	Frame: function:'', file:'file:///src/app/app.module.tns.ts:18:4
System.err: 	Frame: function:'./app/app.module.tns.ts', file:'file:///src/app/app.module.tns.ts:28:26
System.err: 	Frame: function:'__webpack_require__', file:'file:///src/webpack/bootstrap:750:0
System.err: 	Frame: function:'fn', file:'file:///src/webpack/bootstrap:120:0
System.err: 	Frame: function:'', file:'file:///data/data/org.nativescript.TestApp/files/app/bundle.js', line: 257, column: 77
System.err: 	Frame: function:'./main.tns.ts', file:'file:///data/data/org.nativescript.TestApp/files/app/bundle.js', line: 326, column: 30
System.err: 	Frame: function:'__webpack_require__', file:'file:///src/webpack/bootstrap:750:0
System.err: 	Frame: function:'checkDeferredModules', file:'file:///src/webpack/bootstrap:43:0
System.err: 	Frame: function:'webpackJsonpCallback', file:'file:///src/webpack/bootstrap:30:0
System.err: 	Frame: function:'', file:'file:///data/data/org.nativescript.TestApp/files/app/bundle.js', line: 2, column: 57
System.err: 	Frame: function:'require', file:'', line: 1, column: 266
System.err: ReferenceError: HomeComponent is not defined
System.err: StackTrace:
System.err: java.lang.RuntimeException: Unable to create application com.tns.NativeScriptApplication: com.tns.NativeScriptException: Error calling module function 
System.err: ReferenceError: HomeComponent is not defined
System.err: File: "file:///src/app/app.module.tns.ts:18:4
System.err: StackTrace: 
System.err: 	Frame: function:'', file:'file:///src/app/app.module.tns.ts:18:4
System.err: 	Frame: function:'./app/app.module.tns.ts', file:'file:///src/app/app.module.tns.ts:28:26
System.err: 	Frame: function:'__webpack_require__', file:'file:///src/webpack/bootstrap:750:0
System.err: 	Frame: function:'fn', file:'file:///src/webpack/bootstrap:120:0
System.err: 	Frame: function:'', file:'file:///data/data/org.nativescript.TestApp/files/app/bundle.js', line: 257, column: 77
System.err: 	Frame: function:'./main.tns.ts', file:'file:///data/data/org.nativescript.TestApp/files/app/bundle.js', line: 326, column: 30
System.err: 	Frame: function:'__webpack_require__', file:'file:///src/webpack/bootstrap:750:0
System.err: 	Frame: function:'checkDeferredModules', file:'file:///src/webpack/bootstrap:43:0
System.err: 	Frame: function:'webpackJsonpCallback', file:'file:///src/webpack/bootstrap:30:0
System.err: 	Frame: function:'', file:'file:///data/data/org.nativescript.TestApp/files/app/bundle.js', line: 2, column: 57
System.err: 	Frame: function:'require', file:'', line: 1, column: 266
System.err: ReferenceError: HomeComponent is not defined
System.err: 	at android.app.ActivityThread.handleBindApplication(ActivityThread.java:4710)
System.err: 	at android.app.ActivityThread.-wrap1(ActivityThread.java)
System.err: 	at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1405)
System.err: 	at android.os.Handler.dispatchMessage(Handler.java:102)
System.err: 	at android.os.Looper.loop(Looper.java:148)
System.err: 	at android.app.ActivityThread.main(ActivityThread.java:5417)
System.err: 	at java.lang.reflect.Method.invoke(Native Method)
System.err: 	at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:726)
System.err: 	at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:616)
System.err: Caused by: com.tns.NativeScriptException: Error calling module function 
System.err: ReferenceError: HomeComponent is not defined
System.err: File: "file:///src/app/app.module.tns.ts:18:4
System.err: StackTrace: 
System.err: 	Frame: function:'', file:'file:///src/app/app.module.tns.ts:18:4
System.err: 	Frame: function:'./app/app.module.tns.ts', file:'file:///src/app/app.module.tns.ts:28:26
System.err: 	Frame: function:'__webpack_require__', file:'file:///src/webpack/bootstrap:750:0
System.err: 	Frame: function:'fn', file:'file:///src/webpack/bootstrap:120:0
System.err: 	Frame: function:'', file:'file:///data/data/org.nativescript.TestApp/files/app/bundle.js', line: 257, column: 77
System.err: 	Frame: function:'./main.tns.ts', file:'file:///data/data/org.nativescript.TestApp/files/app/bundle.js', line: 326, column: 30
System.err: 	Frame: function:'__webpack_require__', file:'file:///src/webpack/bootstrap:750:0
System.err: 	Frame: function:'checkDeferredModules', file:'file:///src/webpack/bootstrap:43:0
System.err: 	Frame: function:'webpackJsonpCallback', file:'file:///src/webpack/bootstrap:30:0
System.err: 	Frame: function:'', file:'file:///data/data/org.nativescript.TestApp/files/app/bundle.js', line: 2, column: 57
System.err: 	Frame: function:'require', file:'', line: 1, column: 266
System.err: ReferenceError: HomeComponent is not defined
System.err: 	at com.tns.Runtime.runModule(Native Method)
System.err: 	at com.tns.Runtime.runModule(Runtime.java:663)
System.err: 	at com.tns.Runtime.run(Runtime.java:655)
System.err: 	at com.tns.NativeScriptApplication.onCreate(NativeScriptApplication.java:21)
System.err: 	at android.app.Instrumentation.callApplicationOnCreate(Instrumentation.java:1013)
System.err: 	at android.app.ActivityThread.handleBindApplication(ActivityThread.java:4707)
System.err: 	... 8 more
Successfully transferred bundle.0a56fc5a316cba213a88.hot-update.js on device emulator-5562.
Successfully transferred 0a56fc5a316cba213a88.hot-update.json on device emulator-5562.
Refreshing application on device emulator-5562...

ERROR in src/app/app-routing.module.tns.ts(3,24): error TS2306: File '/home/nsbuilduser/workspace/master-schematics-e2e-linux/TestApp/src/app/app.routes.ts' is not a module.

ActivityManager: Process org.nativescript.TestApp (pid 3203) has died
Successfully synced application org.nativescript.TestApp on device emulator-5562.

Expected behavior
App recovers after crash (it is crash after fist file changes) and works properly.

Sample project
No

Additional context
Same workflow with tns run android --no-hmr works properly.
It was ok with hmr and latest official version of schematics plus {N} 5.4.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bug

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions