allow the use of typescript helpers
farfromrefug opened this issue · comments
I am facing the same issue that i have on android.
While using Nativescript / Vue / Typescript, i need this in my ts config
"importHelpers": true, //for vue to work
"noEmitHelpers": true,
"noEmitOnError": true,
"esModuleInterop": true
However if i now want to extend native class, to use custom delegate for example (extending NSObject) i get the following error at runtime
TypeError: Attempted to assign to readonly property
which happens here:
var tslib_1 = __webpack_require__("../node_modules/tslib/tslib.es6.js");
var utils = tslib_1.__importStar(__webpack_require__("../node_modules/tns-core-modules/utils/utils.js"));
var view_1 = __webpack_require__("../node_modules/tns-core-modules/ui/core/view/view.js");
var DocumentPickerDelegate = /** @class */ (function (_super) {
tslib_1.__extends(DocumentPickerDelegate, _super);
For that i need importHelpers
to false
. So you see you can't have both...
We import all helpers from tslib
and inject them in the global scope here. This should be one fo the fist things that should happen in a NS app - it is included in the global.ts
which also loads other other important global functions.
That said, all the tslib
helpers should be in place if you make sure to import globals or application (which also loads globals) first in your app and you should be able to run with "importHelpers": false
.
Maybe I'm missing something vue-specific here. Do you know why "importHelpers": true
is required for vue to work?
@vakrilov yeah this is something that only happens with Vue. Even more only happens with Vue projects using vue
decorators to extends Vue objects. Like this
https://github.com/cairn-monnaie/CairnMobile/blob/master/app/components/Home.vue
I need to create a sample with this. If i put importHelpers=false
i get another error on vue bject construction. Will get the error and print it here
BTW i tried suing noImplicitUseStrict=false
and it stills gives the error:
*** Terminating app due to uncaught exception 'NativeScript encountered a fatal error: TypeError: Attempted to assign to readonly property.
@vakrilov this is the error i get with
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"importHelpers": false,
"noEmitHelpers": true,
"noEmitOnError": true,
"preserveSymlinks": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"noImplicitUseStrict": true,
*** Terminating app due to uncaught exception 'NativeScript encountered a fatal error: TypeError: undefined is not an object (evaluating 'this[sourceKey][key]')
at
1 proxyGetter@file:///app/vendor.js:30572:27
2 get@file:///app/vendor.js:30546:20
3 render@file:///app/bundle.js:2661:25
4 _render@file:///app/vendor.js:31720:26
5 updateComponent@file:///app/vendor.js:24016:28
6 get@file:///app/vendor.js:23099:29
7 Watcher@file:///app/vendor.js:23086:48
8 mountComponent@file:///app/vendor.js:24022:14
9 init@file:///app/vendor.js:31334:19
10 createComponent@file:///app/vendor.js:24331:10
11 createElm@file:///app/vendor.js:24280:24
12 createChildren@file:///app/vendor.js:24417:18
13 createElm@file:///app/vendor.js:24303:23
14 createChildren@file:///app/vendor.js:24417:18
15 createElm@file:///app/vendor.js:24303:23
16 patch@file:///app/vendor.js:24878:16
17 _update@file:///app/vendor.js:23904:28
18 updateComponent@file:///app/vendor.js:24016:17
19 get@file:///app/vendor.js:23099:29
So here is a sample app as a base to test the issue
https://github.com/farfromrefug/vue_ts_template
As it is the app works. It is setup with importHelpers=true
Now if you changeimportHelpers=false
the app will fail. But not with the same error i have within my app :s
There it seems to end up in an endless loop rendering the app
Hope this will help
BTW: it 's on purpose to use allowSyntheticDefaultImports
and esModuleInterop
as i need it to work with those.
I worked quite a lot on that issue. Please seem my comment on the android version of the issue
NativeScript/android#1179
The android-runtime
issue has been fixed in latest version 5.2.
Now the iOS issue remain, both the crash with importHelpers:true
and the endless loop with importHelpers:false
.
Seeing the issue of the endless loop does not happen on android i am let to believe this is an issue with the ios-runtime
@vakrilov just faced that issue again on iOS while working on demo app for my nativescript-canvas
module.
You can easily reproduce it by cloning https://github.com/Akylas/nativescript-canvas
and run
tns run ios --hmr --env.development
in the demo-vue folder.
The development
env creates aliases for webpack so that it uses the plugin sources directly (ts) instead of the compiled version.
But it also triggers the error on iOS:
TypeError: Attempted to assign to readonly property
when trying to extend UIView
Is that something someone can look at?