search

NativeScript / NativeScript

⚡ Empowering JavaScript with native platform APIs. ✨ Best of all worlds (TypeScript, Swift, Objective C, Kotlin, Java, Dart). Use what you love ❤️ Angular, Capacitor, Ionic, React, Solid, Svelte, Vue with: iOS (UIKit, SwiftUI), Android (View, Jetpack Compose), Dart (Flutter) and you name it compatible.
https://nativescript.org
MIT License
24.1k stars 1.64k forks source link

[Angular] hmr handling #8754

Open m4rl0ne opened 4 years ago

m4rl0ne commented 4 years ago

When I create a new project with the following command:

tns create demoProjectName --ng

and I run tns run ios to run it in my emulator it works fine the first time it starts, but as soon as I change something (i.e. the ActionBar title in the sample items component) and webpack is running, the app won't start anymore and crashes with the following message:

CONSOLE INFO file: node_modules/nativescript-dev-webpack/hot.js:3:0: HMR: The following modules were updated:
CONSOLE INFO file: node_modules/nativescript-dev-webpack/hot.js:3:0: HMR:          ↻ ./app/item/items.component.html
CONSOLE INFO file: node_modules/nativescript-dev-webpack/hot.js:3:0: HMR:          ↻ ./app/item/items.component.ts
CONSOLE INFO file: node_modules/nativescript-dev-webpack/hot.js:3:0: HMR:          ↻ ./app/app-routing.module.ts
CONSOLE INFO file: node_modules/nativescript-dev-webpack/hot.js:3:0: HMR:          ↻ ./app/app.module.ts
CONSOLE INFO file: node_modules/nativescript-dev-webpack/hot.js:3:0: HMR: Successfully applied update with hmr hash 98a74e9d60367a270d1e. App is up to date.
***** Fatal JavaScript exception - application has been terminated. *****
Native stack trace:
1   0x10e54060e NativeScript::reportFatalErrorBeforeShutdown(JSC::ExecState*, JSC::Exception*, bool)
2   0x10e581548 NativeScript::FFICallback<NativeScript::ObjCMethodCallback>::ffiClosureCallback(ffi_cif*, void*, void**, void*)
3   0x10ef82222 ffi_closure_unix64_inner
4   0x10ef82c4a ffi_closure_unix64
5   0x7fff23da2414 __CFRUNLOOP_IS_CALLING_OUT_TO_A_TIMER_CALLBACK_FUNCTION__
6   0x7fff23da20ae __CFRunLoopDoTimer
7   0x7fff23da170a __CFRunLoopDoTimers
8   0x7fff23d9c35e __CFRunLoopRun
9   0x7fff23d9b8a4 CFRunLoopRunSpecific
10  0x7fff38c39bbe GSEventRunModal
11  0x7fff49325968 UIApplicationMain
12  0x10ef82a8d ffi_call_unix64
13  0x112bf7640
JavaScript stack trace:
file: node_modules/@nativescript/core/ui/core/view-base/view-base.js:472:0
at file: node_modules/@nativescript/angular/view-util.js:191:0
at file: node_modules/@nativescript/angular/view-util.js:119:0
at file: node_modules/@nativescript/angular/renderer.js:60:0
at forEach([native code])
at file: node_modules/@angular/core/__ivy_ngcc__/fesm5/core.js:11528:0
at file: node_modules/@angular/core/__ivy_ngcc__/fesm5/core.js:24842:0
at file: node_modules/@nativescript/angular/platform-common.js:221:0
at file: node_modules/@nativescript/angular/platform-common.js:103:74
at file: node_modules/@nativescript/angular/zone-js/dist/zone-nativescript.js:188:0
at file: node_modules/@nativescript/angular/zone-js/dist/zone-nativescript.js:496:0
at timer(file: node_modules/@nativescript/angular/zone-js/dist/zone-nativescript.js:1561:0)
at invoke(file: node_modules/@nativescript/core/timer/timer.ios.js:54:30)
at file: node_modules/@nativescript/angular/zone-js/dist/zone-nativescript.js:151:0
at file: node_modules/@nativescript/core/timer/timer.ios.js:18:0
at UIApplicationMain([native code])
at run(file: node_modules/@nativescript/core/application/application.ios.js:312:0)
at file: node_modules/@nativescript/angular/platform-common.js:211:0
at file: node_modules/@nativescript/angular/platform-common.js:112:0
at file: node_modules/@nativescript/angular/platform-common.js:92:0
at file:///app/bundle.js:345:145
at ./main.ts(file:///app/bundle.js:350:34)
at __webpack_require__(file: src/webpack/bootstrap:750:0)
at checkDeferredModules(file: src/webpack/bootstrap:43:0)
at webpackJsonpCallback(file: src/webpack/bootstrap:30:0)
at anonymous(file:///app/bundle.js:2:61)
at evaluate([native code])
at modu<…>
JavaScript error:
file: node_modules/@nativescript/core/ui/core/view-base/view-base.js:472:0: JS ERROR Error: View not added to this instance. View: ProxyViewContainer(8) CurrentParent: Page(4) ExpectedParent: AppHostView(1)
***** Fatal JavaScript exception - application has been terminated. *****
Native stack trace:
1   0x10e54060e NativeScript::reportFatalErrorBeforeShutdown(JSC::ExecState*, JSC::Exception*, bool)
2   0x10e5925f4 -[TNSRuntime executeModule:referredBy:]
3   0x10de32db3 main
4   0x7fff520ce1fd start
5   0x1
JavaScript stack trace:
UIApplicationMain(file: node_modules/@nativescript/core/application/application.ios.js:312:0)
at run(file: node_modules/@nativescript/core/application/application.ios.js:312:0)
at file: node_modules/@nativescript/angular/platform-common.js:211:0
at file: node_modules/@nativescript/angular/platform-common.js:112:0
at file: node_modules/@nativescript/angular/platform-common.js:92:0
at file:///app/bundle.js:345:145
at ./main.ts(file:///app/bundle.js:350:34)
at __webpack_require__(file: src/webpack/bootstrap:750:0)
at checkDeferredModules(file: src/webpack/bootstrap:43:0)
at webpackJsonpCallback(file: src/webpack/bootstrap:30:0)
at anonymous(file:///app/bundle.js:2:61)
at evaluate([native code])
at moduleEvaluation([native code])
at [native code]
at asyncFunctionResume([native code])
at [native code]
at promiseReactionJob([native code])
JavaScript error:
file: node_modules/@nativescript/core/application/application.ios.js:312:0: JS ERROR Error
***** Fatal JavaScript exception - application has been terminated. *****
Native stack trace:
1   0x10e54060e NativeScript::reportFatalErrorBeforeShutdown(JSC::ExecState*, JSC::Exception*, bool)
2   0x10e58ff76 -[TNSRuntimeInspector reportFatalError:]
3   0x10de3523b TNSInspectorUncaughtExceptionHandler
4   0x7fff23e3e2cd __handleUncaughtException
5   0x7fff51253c05 _objc_terminate()
6   0x7fff500a1c87 std::__terminate(void (*)())
7   0x7fff500a440b __cxa_get_exception_ptr
8   0x7fff500a43d2 __cxxabiv1::exception_cleanup_func(_Unwind_Reason_Code, _Unwind_Exception*)
9   0x7fff51253ad6 _objc_exception_destructor(void*)
10  0x10e540b4f NativeScript::reportFatalErrorBeforeShutdown(JSC::ExecState*, JSC::Exception*, bool)
11  0x10e5925f4 -[TNSRuntime executeModule:referredBy:]
12  0x10de32db3 main
13  0x7fff520ce1fd start
14  0x1
JavaScript stack trace:
JavaScript error:
JS ERROR Error: NativeScript encountered a fatal error: Error
at
UIApplicationMain(file: node_modules/@nativescript/core/application/application.ios.js:312:0)
at run(file: node_modules/@nativescript/core/application/application.ios.js:312:0)
at file: node_modules/@nativescript/angular/platform-common.js:211:0
at file: node_modules/@nativescript/angular/platform-common.js:112:0
at file: node_modules/@nativescript/angular/platform-common.js:92:0
at file:///app/bundle.js:345:145
at ./main.ts(file:///app/bundle.js:350:34)
at __webpack_require__(file: src/webpack/bootstrap:750:0)
at checkDeferredModules(file: src/webpack/bootstrap:43:0)
at webpackJsonpCallback(file: src/webpack/bootstrap:30:0)
at anonymous(file:///app/bundle.js:2:61)
at evaluate([native code])
at moduleEvaluation([native code])
at [native code]
at asyncFunctionResume([native code])
at [native code]
at promiseReactionJob([native code])
NativeScript caught signal 6.
Native Stack:
1   0x10e591251 sig_handler(int)
2   0x7fff522ab5fd _sigtramp
3   0x7fff5219ff39 itoa64
4   0x7fff5219bb7c abort
5   0x7fff500a2858 abort_message
6   0x7fff500a1cad std::__terminate(void (*)())
7   0x7fff500a440b __cxa_get_exception_ptr
8   0x7fff500a43d2 __cxxabiv1::exception_cleanup_func(_Unwind_Reason_Code, _Unwind_Exception*)
9   0x7fff51253ad6 _objc_exception_destructor(void*)
10  0x10e540b4f NativeScript::reportFatalErrorBeforeShutdown(JSC::ExecState*, JSC::Exception*, bool)
11  0x10e5925f4 -[TNSRuntime executeModule:referredBy:]
12  0x10de32db3 main
13  0x7fff520ce1fd start
14  0x1
JS Stack:

The only way to get it working again is changing any file (not necessarily the one I was editing before) so that webpack can run a second time. Now it works fine again. I always have to do 2 changes for the app to work.

Versions: (latest versions because I just created it 5 minutes ago via CLI): tns-cli: 6.8.0 tns-ios: 6.5.0 angular/core: 9.1.0 ngtools/webpack: 9.1.0 nativescript-dev-webpack: 1.5.0

NathanWalker commented 4 years ago

@m4rl0ne For now when developing with Angular 9 and 10 Ivy disable hmr by adding this flag: --no-hmr to your run/debug command.

tns run android --no-hmr

We're looking to replace hmr with socket handling so in meantime best to disable hmr.

cjohn001 commented 4 years ago

+1

timoschlueter commented 3 years ago

+1