nativescript-vue · heywhy · Apr 26, 2023 · Apr 26, 2023 · Apr 26, 2023 · Apr 26, 2023
diff --git a/.editorconfig b/.editorconfig
@@ -0,0 +1,12 @@
+# EditorConfig is awesome: https://EditorConfig.org
+
+# top-most EditorConfig file
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
diff --git a/.husky/commit-msg b/.husky/commit-msg
@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npx --no -- commitlint --edit "$1"
diff --git a/.husky/pre-commit b/.husky/pre-commit
@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npx --no-install lint-staged
diff --git a/.lintstagedrc b/.lintstagedrc
@@ -0,0 +1,3 @@
+{
+  "**/*.{js,ts}": ["prettier --config ./.prettierrc.js -w"]
+}
diff --git a/.prettierignore b/.prettierignore
@@ -0,0 +1,2 @@
+demo/
+dist/
diff --git a/.prettierrc.js b/.prettierrc.js
@@ -0,0 +1,6 @@
+module.exports = {
+  trailingComma: 'es5',
+  tabWidth: 2,
+  semi: true,
+  singleQuote: true,
+};
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -1,21 +1,19 @@
 {
-    "files.exclude": {
-        "**/.git": true,
-        "**/.svn": true,
-        "**/.hg": true,
-        "**/CVS": true,
-        "**/.DS_Store": true,
-        "**/Thumbs.db": true,
-        "**/*.js": {
-            "when": "$(basename).ts"
-        },
-        "**/*.map": true,
-        "**/.idea": false,
-        "**/.tscache": true,
-        "**/node_modules": false
+  "files.exclude": {
+    "**/.git": true,
+    "**/.svn": true,
+    "**/.hg": true,
+    "**/CVS": true,
+    "**/.DS_Store": true,
+    "**/Thumbs.db": true,
+    "**/*.js": {
+      "when": "$(basename).ts"
     },
+    "**/*.map": true,
+    "**/.idea": false,
+    "**/.tscache": true,
+    "**/node_modules": false
+  },
 
-    "html.customData": [
-        "./test.json"
-    ]
-}
+  "html.customData": ["./test.json"]
+}
diff --git a/README.md b/README.md
@@ -4,7 +4,6 @@
 
 <h1 align="center">NativeScript-Vue3 Beta</h1>
 
-
 <p align="center">
     <a href="https://www.npmjs.com/package/nativescript-vue">
        <img src="https://img.shields.io/npm/v/nativescript-vue/beta.svg" alt="npm">
@@ -14,7 +13,6 @@
     </a>
 </p>
 
-
 NativeScript-Vue with Vue3 support now in beta!
 
 ## Quick start
@@ -38,7 +36,6 @@ If you encounter any issues, please open a new issue with as much detail as poss
 
 - [Join Discord](https://nativescript.org/discord)
 
-
 ## Looking for V2?
 
 The V2 version has been moved to the [v2 branch](https://github.com/nativescript-vue/nativescript-vue/tree/v2)
diff --git a/build.js b/build.js
@@ -1,6 +1,6 @@
-import path from "path";
-import { fileURLToPath } from "url";
-import { build } from "esbuild";
+import path from 'path';
+import { fileURLToPath } from 'url';
+import { build } from 'esbuild';
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
@@ -9,17 +9,17 @@ try {
   await build({
     bundle: true,
     sourcemap: true,
-    format: "cjs",
+    format: 'cjs',
     // target: "node",
-    external: ["@nativescript/core"],
-    entryPoints: [path.join(__dirname, "src", "index.ts")],
-    outdir: path.join(__dirname, "dist"),
+    external: ['@nativescript/core'],
+    entryPoints: [path.join(__dirname, 'src', 'index.ts')],
+    outdir: path.join(__dirname, 'dist'),
     // outExtension: { ".js": ".mjs" },
     define: {
       __VUE_OPTIONS_API__: true,
-      __VUE_PROD_DEVTOOLS__: true
-    }
+      __VUE_PROD_DEVTOOLS__: true,
+    },
   });
 } catch {
   process.exitCode = 1;
-}
+}
diff --git a/commitlint.config.js b/commitlint.config.js
@@ -0,0 +1 @@
+module.exports = { extends: ['@commitlint/config-conventional'] };
diff --git a/demo/app/app.ts b/demo/app/app.ts
@@ -1,8 +1,4 @@
-import { createApp } from "vue";
-
-// @ts-ignore
-global.window = global;
-// import Home from './components/Home.vue'
+import { createApp } from "nativescript-vue";
 
 import App from "./components/demo_ListView.vue";
 

diff --git a/demo/app/components/Bench.vue b/demo/app/components/Bench.vue
@@ -6,7 +6,7 @@ export default {
       show: false,
       iter: 0,
 
-      times: [],
+      times: [] as number[],
     };
   },
   methods: {
@@ -64,10 +64,10 @@ export default {
       <template v-if="show">
         <Label
           v-for="i in 2000"
-          :key="this.iter + 'item' + i"
+          :key="iter + 'item' + i"
           text="Hello World"
         />
-        <Label @loaded="end" :key="this.iter + 'end'" text="End" />
+        <Label @loaded="end" :key="iter + 'end'" text="End" />
       </template>
     </GridLayout>
   </Page>

diff --git a/demo/app/components/GH1010.vue b/demo/app/components/GH1010.vue
@@ -1,6 +1,7 @@
 <!-- https://github.com/nativescript-vue/nativescript-vue/issues/1010 -->
 <script lang="ts" setup>
-import { ref } from "vue";
+import { EventData } from "@nativescript/core";
+import { ref } from "nativescript-vue";
 
 const tapCount = ref(0);
 
@@ -9,7 +10,7 @@ function onTap() {
   console.trace("Tapped!", tapCount.value);
 }
 
-function onLoaded(args) {
+function onLoaded(_args: EventData) {
   console.log("STACK LOADED")
 }
 </script>

diff --git a/demo/app/components/GH1012.vue b/demo/app/components/GH1012.vue
@@ -1,11 +1,14 @@
 <script lang="ts" setup>
-const wait = ms => new Promise(resolve => setTimeout(resolve, ms));
+import type { Button, EventData } from "@nativescript/core";
+import { Color } from "@nativescript/core";
 
-async function animateIn(args) {
+const wait = (ms: number) => new Promise(resolve => setTimeout(resolve, ms));
+
+async function animateIn(args: EventData) {
   console.log("ANIMATE")
   await wait(1);
-  const view = args.object;
-  view.color = "green";
+  const view = args.object as Button;
+  view.color = new Color("green");
   view.scaleX = 0;
   view.scaleY = 0;
 
@@ -19,7 +22,7 @@ async function animateIn(args) {
       duration: 3000,
     })
     .then(() => {
-      view.color = "red";
+      view.color = new Color("red");
     })
     .catch((err) => console.log(err));
 }

diff --git a/demo/app/components/Home.vue b/demo/app/components/Home.vue
@@ -1,12 +1,15 @@
 <script setup lang="ts">
 import Test from "./Test.vue";
 import { goHome } from "~/composables/goHome";
-import { onUnmounted } from "vue";
-import { ListItem } from "../../../src";
+import { onUnmounted } from "nativescript-vue";
+import { ListItem } from "nativescript-vue";
 
-defineProps<{
-  depth?: number;
-}>();
+defineProps({
+  depth: {
+    type: Number,
+    default: 0
+  }
+});
 
 const message = "Hello World!";
 

diff --git a/demo/app/components/demo_ListView.vue b/demo/app/components/demo_ListView.vue
@@ -1,15 +1,17 @@
 <script setup lang="ts">
 import { ObservableArray } from "@nativescript/core";
 import { useDebounceFn } from "@vueuse/shared";
-import { ref } from "vue";
+import { ref } from "nativescript-vue";
 import { goHome } from "../composables/goHome";
 import { useFPS } from "../composables/useFPS";
+import type { ListItem } from "nativescript-vue";
 
 const navigate = () => {
   goHome();
 };
 
 interface Item {
+  name: string;
   title: string;
   text: string;
   date: Date;
@@ -67,7 +69,7 @@ setInterval(() => {
 //   items2.value.push({ name: name.value });
 // }, 100);
 
-const onItemTap = useDebounceFn((item) => {
+const onItemTap = useDebounceFn((item: Item) => {
   console.log("ITEM TAP", item);
   if (selected.value.includes(item)) {
     selected.value.splice(selected.value.indexOf(item), 1);
@@ -111,7 +113,7 @@ const onItemTap = useDebounceFn((item) => {
           <Label>Selected: {{ selected.length }}</Label>
 
           <ListView :items="items2" height="800">
-            <template #default="{ item, index }: ListItem<{ name: string }>">
+            <template #default="{ item, index }: ListItem<Item>">
               <StackLayout
                 @tap="onItemTap(item)"
                 :backgroundColor="selected.includes(item) ? '#ffedd5' : ''"

diff --git a/demo/app/components/demo_ListViewTemplates.vue b/demo/app/components/demo_ListViewTemplates.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref } from "vue";
+import { ListItem, ref } from "nativescript-vue";
 import { goHome } from "../composables/goHome";
 
 import { useTimeAgo } from "@vueuse/core";

diff --git a/demo/app/components/test_TextNodes.vue b/demo/app/components/test_TextNodes.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref } from "vue";
+import { ref } from "nativescript-vue";
 import { goHome } from "../composables/goHome";
 import { useFPS } from "../composables/useFPS";
 

diff --git a/demo/app/composables/goHome.ts b/demo/app/composables/goHome.ts
@@ -1,4 +1,4 @@
-import { $navigateTo, $showModal } from "../../../src";
+import { $navigateTo, $showModal } from "nativescript-vue";
 import Home from "../components/Home.vue";
 
 export function goHome(depth = 0, modal = false) {

diff --git a/demo/app/composables/useFPS.ts b/demo/app/composables/useFPS.ts
@@ -4,7 +4,7 @@ import {
   start,
   stop,
 } from "@nativescript/core/fps-meter";
-import { ref } from "vue";
+import { ref } from "nativescript-vue";
 
 export function useFPS() {
   const fps = ref(60);

diff --git a/demo/package.json b/demo/package.json
@@ -4,17 +4,19 @@
   "version": "1.0.0",
   "private": true,
   "dependencies": {
-    "@nativescript/core": "~8.3.0",
+    "@nativescript/core": "~8.5.0",
     "@vueuse/components": "^9.4.0",
-    "@vueuse/core": "^9.4.0"
+    "@vueuse/core": "^9.4.0",
+    "nativescript-vue": "link:.."
   },
   "devDependencies": {
-    "@nativescript/android": "8.3.1",
-    "@nativescript/ios": "8.3.3",
-    "@nativescript/types": "~8.3.0",
+    "@nativescript/android": "~8.5.0",
+    "@nativescript/ios": "~8.5.0",
+    "@nativescript/types": "~8.5.0",
     "@nativescript/webpack": "~5.0.9",
     "@types/node": "~17.0.21",
-    "typescript": "~4.7.0",
-    "vue-loader": "^17.0.0"
+    "@vue/compiler-sfc": "^3.2.47",
+    "typescript": "~4.9.5",
+    "vue-loader": "^17.1.0"
   }
 }
diff --git a/demo/tsconfig.json b/demo/tsconfig.json
@@ -1,10 +1,10 @@
 {
   "compilerOptions": {
-    "strict": false,
-    "target": "es2017",
+    "strict": true,
+    "target": "esnext",
     "module": "esnext",
     "moduleResolution": "node",
-    "lib": ["dom", "es2017"],
+    "lib": ["esnext", "WebWorker"],
     "sourceMap": true,
     "noEmitHelpers": true,
     "importHelpers": true,
@@ -21,6 +21,10 @@
     "emitDecoratorMetadata": true,
     "skipLibCheck": true
   },
+  "vueCompilerOptions": {
+    "target": 3,
+    "lib": "nativescript-vue"
+  },
   "include": ["app", "types"],
   "exclude": ["node_modules", "platforms"]
 }
diff --git a/demo/types/shims.vue.d.ts b/demo/types/shims.vue.d.ts
@@ -1,5 +1,5 @@
 declare module "*.vue" {
-  import type { DefineComponent } from "../../dist/withCompiler";
+  import type { DefineComponent } from "nativescript-vue";
   const component: DefineComponent<{}, {}, any>;
   export default component;
 }
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		module.exports = { extends: ['@commitlint/config-conventional'] };