loading...

NativeScript and Vue.js

futoase profile image Keiji Matsuzaki ・2 min read

NativeScript and Vue.js

image

NativeScript is supporting of cross platform for iOS and Android. With consisted of front-end platform solution.

Setup

Reference is this blog post.

> npm install -g nativescript

After added command is tns.

> which tns
/Users/futoase/.nodenv/shims/tns

Create sample product (directory).

> tns create sample-project

Install nativescript-vue-plugin

> cd sample-project/
> npm install --save nativescript-vue

Edit of app.js (Reference from Sample)

const Vue = require('nativescript-vue/dist/index');

new Vue({
  template: `
    <page>
      <stack-layout>
        <label text="Hello Vue!" style="background-color:#41b883;color:#ffffff;padding:10;text-align:center"></label>
      </stack-layout>
    </page>
  `,
}).$start();

Running on Emulator

iOS

> tns run ios

image

Android

compile error

            try {
                // different java has different format for `java -version` command
                const output = (await this.$childProcess.spawnFromEvent("java", ["-version"], "exit")).stderr;
                this.javaVerCache = /(?:openjdk|java) version \"((?:\d+\.)+(?:\d+))/i.exec(output)[1];
            } catch (e) {
                this.javaVerCache = null;
            }

Opened issue. issues#3148

error

Because Java 9 output version number from Stdout, But should be get version number from stdout in code...

Reference

Posted on Nov 18 '17 by:

Discussion

markdown guide