@nativescript/template-blank-vue-ts 9.0.6 → 9.0.7

package/app/app.css

@@ -1,6 +1,4 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
+@import "tailwindcss";
 
 ActionBar {
     background-color: #65adf1;

package/app/app.ts

@@ -1,11 +1,5 @@
-import Vue from 'nativescript-vue'
-import Home from './components/Home.vue'
-
-declare let __DEV__: boolean;
+import { createApp } from 'nativescript-vue'
 
-// Prints Vue logs when --env.production is *NOT* set while building
-Vue.config.silent = !__DEV__
+import Home from './components/Home.vue'
 
-new Vue({
-  render: (h) => h('frame', [h(Home)]),
-}).$start()
+createApp(Home).start()

package/app/components/Home.vue

@@ -11,9 +11,7 @@
 </template>
 
 <script lang="ts">
-  import Vue from "nativescript-vue";
-
-  export default Vue.extend({
+  export default {
     computed: {
       message() {
         return "Blank {N}-Vue app";
@@ -25,11 +23,5 @@
         console.log('You have tapped the message!')
       }
     }
-  });
+  };
 </script>
-
-<style>
-  /* .info {
-    font-size: 20;
-  } */
-</style>

package/package.json

@@ -2,7 +2,7 @@
   "name": "@nativescript/template-blank-vue-ts",
   "main": "app/app.ts",
   "displayName": "Blank Vue Typescript",
-  "version": "9.0.6",
+  "version": "9.0.7",
   "description": "Blank Typescript template for NativeScript apps using Vue.",
   "author": "NativeScript Team <oss@nativescript.org>",
   "license": "Apache-2.0",
@@ -25,8 +25,6 @@
     "!tools/assets",
     "types",
     ".editorconfig",
-    "tailwind.config.js",
-    "webpack.config.js",
     "tsconfig.json"
   ],
   "keywords": [
@@ -44,18 +42,14 @@
   ],
   "dependencies": {
     "@nativescript/core": "~9.0.0",
-    "nativescript-vue": "~2.9.3"
+    "nativescript-vue": "^3.0.0"
   },
   "devDependencies": {
-    "@nativescript/tailwind": "^2.1.0",
+    "@nativescript/tailwind": "^4.0.0",
     "@nativescript/types": "~9.0.0",
     "@nativescript/webpack": "~5.0.31",
     "@types/node": "^20.0.0",
-    "nativescript-vue-template-compiler": "~2.9.3",
-    "tailwindcss": "~3.4.0",
-    "typescript": "~5.4.0",
-    "vue": "~2.6.12",
-    "vue-loader": "^15.11.1",
-    "vue-template-compiler": "~2.6.12"
+    "tailwindcss": "^4.0.0",
+    "typescript": "~5.4.0"
   }
 }

package/types/shims.vue.d.ts

@@ -1,4 +1,5 @@
 declare module '*.vue' {
-  import Vue from 'vue'
-  export default Vue
+  import { DefineComponent } from 'nativescript-vue'
+  const component: DefineComponent<{}, {}, any>
+  export default component
 }

package/tailwind.config.js

@@ -1,13 +0,0 @@
-/** @type {import('tailwindcss').Config} */
-module.exports = {
-  content: ['./app/**/*.{css,html,vue,ts,tsx}'],
-  // use the .ns-dark class to control dark mode (applied by NativeScript) - since 'media' (default) is not supported.
-  darkMode: ['class', '.ns-dark'],
-  theme: {
-    extend: {},
-  },
-  plugins: [],
-  corePlugins: {
-    preflight: false, // disables browser-specific resets
-  },
-}

package/webpack.config.js

@@ -1,38 +0,0 @@
-const webpack = require("@nativescript/webpack");
-const path = require("path");
-const VueLoaderPlugin = require("vue-loader/lib/plugin");
-
-module.exports = (env) => {
-	webpack.init(env);
-
-	// Learn how to customize:
-	// https://docs.nativescript.org/webpack
-
-	webpack.chainWebpack((config) => {
-		// Use vue-loader@15 for Vue 2
-		config.resolve.alias.set(
-			"vue-loader",
-			path.resolve(__dirname, "node_modules/vue-loader")
-		);
-
-		// Remove the default VueLoaderPlugin (v17) and add v15
-		config.plugins.delete("VueLoaderPlugin");
-		config.plugin("VueLoaderPlugin").use(VueLoaderPlugin);
-
-		// Configure vue-loader for Vue 2
-		config.module
-			.rule("vue")
-			.use("vue-loader")
-			.loader(require.resolve("vue-loader"))
-			.tap((options) => ({
-				...options,
-				compiler: require("vue-template-compiler"),
-				compilerOptions: {
-                    whitespace: 'condense',
-                    preserveWhitespace: false,
-                },
-			}));
-	});
-
-	return webpack.resolveConfig();
-};