Error trying use nativescript-drawingpad


#1

Someone help me please :frowning:

An uncaught Exception occurred on “main” thread.
java.lang.RuntimeException: Unable to start activity ComponentInfo{org.nativescript.WPFeed/com.tns.NativeScriptActivity}: com.tns.NativeScriptException:
Calling js method onCreate failed

Cannot compile /data/data/org.nativescript.WPFeed/files/app/main-page.js

SyntaxError: Unexpected token import
File: "/data/data/org.nativescript.WPFeed/files/app/main-page.js, line: 45, column: 0

StackTrace:
Frame: function:‘require’, file:’’, line: 1, column: 266
Frame: function:‘global.loadModule’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/globals/globals.js’, line: 29, column: 31
Frame: function:‘resolvePageFromEntry’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/frame-common.js’, line: 79, column: 40
Frame: function:‘Frame.navigate’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/frame-common.js’, line: 165, column: 20
Frame: function:‘ActivityCallbacksImplementation.onCreate’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/frame.js’, line: 690, column: 19
Frame: function:‘NativeScriptActivity.onCreate’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/activity.js’, line: 13, column: 25

SyntaxError: Unexpected token import
File: ", line: 1, column: 265

StackTrace:
Frame: function:‘require’, file:’’, line: 1, column: 266
Frame: function:‘global.loadModule’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/globals/globals.js’, line: 29, column: 31
Frame: function:‘resolvePageFromEntry’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/frame-common.js’, line: 79, column: 40
Frame: function:‘Frame.navigate’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/frame-common.js’, line: 165, column: 20
Frame: function:‘ActivityCallbacksImplementation.onCreate’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/frame.js’, line: 690, column: 19
Frame: function:‘NativeScriptActivity.onCreate’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/activity.js’, line: 13, column: 25

at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2358)
at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2420)
at android.app.ActivityThread.access$900(ActivityThread.java:154)
at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1321)
at android.os.Handler.dispatchMessage(Handler.java:102)
at android.os.Looper.loop(Looper.java:135)
at android.app.ActivityThread.main(ActivityThread.java:5294)
at java.lang.reflect.Method.invoke(Native Method)
at java.lang.reflect.Method.invoke(Method.java:372)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:904)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:699)

Caused by: com.tns.NativeScriptException:
Calling js method onCreate failed

Cannot compile /data/data/org.nativescript.WPFeed/files/app/main-page.js

SyntaxError: Unexpected token import
File: "/data/data/org.nativescript.WPFeed/files/app/main-page.js, line: 45, column: 0

StackTrace:
Frame: function:‘require’, file:’’, line: 1, column: 266
Frame: function:‘global.loadModule’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/globals/globals.js’, line: 29, column: 31
Frame: function:‘resolvePageFromEntry’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/frame-common.js’, line: 79, column: 40
Frame: function:‘Frame.navigate’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/frame-common.js’, line: 165, column: 20
Frame: function:‘ActivityCallbacksImplementation.onCreate’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/frame.js’, line: 690, column: 19
Frame: function:‘NativeScriptActivity.onCreate’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/activity.js’, line: 13, column: 25

SyntaxError: Unexpected token import
File: ", line: 1, column: 265

StackTrace:
Frame: function:‘require’, file:’’, line: 1, column: 266
Frame: function:‘global.loadModule’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/globals/globals.js’, line: 29, column: 31
Frame: function:‘resolvePageFromEntry’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/frame-common.js’, line: 79, column: 40
Frame: function:‘Frame.navigate’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/frame-common.js’, line: 165, column: 20
Frame: function:‘ActivityCallbacksImplementation.onCreate’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/frame.js’, line: 690, column: 19
Frame: function:‘NativeScriptActivity.onCreate’, file:’/data/data/org.nativescript.WPFeed/files/app/tns_modules/ui/frame/activity.js’, line: 13, column: 25

at com.tns.Runtime.callJSMethodNative(Native Method)
at com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1022)
at com.tns.Runtime.callJSMethodImpl(Runtime.java:907)
at com.tns.Runtime.callJSMethod(Runtime.java:895)
at com.tns.Runtime.callJSMethod(Runtime.java:879)
at com.tns.Runtime.callJSMethod(Runtime.java:871)
at com.tns.NativeScriptActivity.onCreate(android.app.Activity.java)
at android.app.Activity.performCreate(Activity.java:5990)
at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1106)
at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2311)
... 10 more

#2

Try removing and adding the platforms back. Rebuilding and uninstalling any old app from the device/emulator before running the fresh build.


#3

I had tried to do this but I always have the same result :frowning:

I already tried on the mobile phone and emulator


#4

My package.json:

{
“description”: “NativeScript Application”,
“license”: "SEE LICENSE IN ",
“readme”: “NativeScript Application”,
“repository”: “”,
“nativescript”: {
“id”: “org.nativescript.WPFeed”,
“tns-android”: {
“version”: “2.4.1”
}
},
“dependencies”: {
“nativescript-drawingpad”: “^1.1.2”,
“nativescript-theme-core”: “^0.2.1”,
“tns-core-modules”: “^2.4.4”
},
“devDependencies”: {
“babel-traverse”: “6.21.0”,
“babel-types”: “6.21.0”,
“babylon”: “6.14.1”,
“lazy”: “1.0.11”,
“nativescript-dev-android-snapshot”: “^0..
}
}

I read something about tns-core-modules version but idk if my is right.


#5

Can you show the code here? Maybe you have a typo?


#6

45 line is my first import (The reason for starting this line is because I have an old commented code)

45 line is that-> import {Component, ElementRef, ViewChild} from ‘@angular/core’;
import {registerElement} from “nativescript-angular/element-registry”;

registerElement(“DrawingPad”, () => require(“nativescript-drawingpad”).DrawingPad);

@Component({
selector: ‘drawing-pad-example’,
template: `


<DrawingPad #DrawingPad
height=“400"
id=“drawingPad"
penColor=”#ff4081” penWidth=“3”>

        <StackLayout orientation="horizontal">
            <Button text="Get Drawing" (tap)="getMyDrawing()"></Button>
            <Button text="Clear Drawing" (tap)="clearMyDrawing()"></Button>
        </StackLayout>
    </StackLayout>
</ScrollView>
`

})
export class DrawingPadExample {

@ViewChild("DrawingPad") DrawingPad: ElementRef;

getMyDrawing(args) {
    // get reference to the drawing pad
    let pad = this.DrawingPad.nativeElement;

    // then get the drawing (Bitmap on Android) of the drawingpad
    let drawingImage;
    pad.getDrawing().then(function(data) {
        console.log(data);
        drawingImage = data;
    }, function(err) {
        console.log(err);
    });
}

clearMyDrawing(args) {
    var pad = this.DrawingPad.nativeElement;
    pad.clearDrawing();
}

}


#7

Are you missing the explicit closing tag for the component? I once thought with angular+NS you had to explicitly close all view components?

Like this from the README:

<DrawingPad #DrawingPad height="400" id="drawingPad" penColor="#ff4081" penWidth="3"> </DrawingPad>


#9

Idk why nativescript forum dont show that part :o
I already have that…

my code:

@Component({
selector: ‘drawing-pad-example’,
template: `


<DrawingPad #DrawingPad
height=“400"
id=“drawingPad"
penColor=”#ff4081” penWidth=“3”>

        <StackLayout orientation="horizontal">
            <Button text="Get Drawing" (tap)="getMyDrawing()"></Button>
            <Button text="Clear Drawing" (tap)="clearMyDrawing()"></Button>
        </StackLayout>
    </StackLayout>
</ScrollView>
`

})


#10


#11

The issue is unfortunately not with the plugin :frowning: but as the error points out that line in the transpiled .js is throwing. I don’t use angular or I’d test a sample app for you using it. Might see if someone knows why the angular imports are flaking out on your there.


#12

the demo from github work :o

I must have screwed up another file in the project :confused: