ios-jsc

ios-jsc copied to clipboard

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 https://github.com/NativeScript/android-runtime/issues/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?