+
+
diff --git a/src/assets/not-found.svg b/src/assets/not-found.svg
new file mode 100644
index 0000000..47a0a54
--- /dev/null
+++ b/src/assets/not-found.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/assets/logo.svg b/src/assets/vite-logo.svg
similarity index 100%
rename from src/assets/logo.svg
rename to src/assets/vite-logo.svg
diff --git a/src/assets/vue-logo.svg b/src/assets/vue-logo.svg
new file mode 100644
index 0000000..a1d285e
--- /dev/null
+++ b/src/assets/vue-logo.svg
@@ -0,0 +1,2 @@
+
+
diff --git a/src/components/CompositionSection.vue b/src/components/CompositionSection.vue
deleted file mode 100644
index 3c5d4a3..0000000
--- a/src/components/CompositionSection.vue
+++ /dev/null
@@ -1,24 +0,0 @@
-
-
- Switch to the dark side
-
- To learn more about env variablels in Vite click - here -
-
-
-
- - {{ env[selectedKey] }} -
-
+
+ {{ title }}
+
+
+
+
+
+
diff --git a/src/components/FeatureSection.vue b/src/components/FeatureSection.vue
deleted file mode 100644
index b4379b3..0000000
--- a/src/components/FeatureSection.vue
+++ /dev/null
@@ -1,30 +0,0 @@
-
-
+
+ + {{ text }} +
+ + Learn More +
- Installed Vite plugins
-
-
-
-
-
-
-
-
-
-
+ Installed Vite plugins 📦
+
+ + You can even find more awesome Vite plugins + + here + +
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+ Vite ⚡ - Vue 2 starter template
+
+ + This example project shows how to speed up your Vue 2 application with + the next generation frontend tooling Vite. +
+
+
+ Vue docs
+
+
+
+ About
+
+
+
- 
-
-
-
- Vite - Vue 2 example
-
- - This example project shows how to speed up your Vue 2 application with - the next generation frontend tooling Vite. -
-
-
- Vite docs
-
-
-
- Vue docs
-
-
-
+
+ 
+
+ {{ appName }}
+
+
+
+
+
+
+
+ {{ appName }}
+
+
-
- {{ title }}
-
-
-
-
-
-
diff --git a/src/components/shared/Heading2.vue b/src/components/shared/Heading2.vue
index a75a80c..c99e716 100644
--- a/src/components/shared/Heading2.vue
+++ b/src/components/shared/Heading2.vue
@@ -1,6 +1,6 @@
-
- - {{ text }} -
- Learn More - - -
-
-
diff --git a/src/main.ts b/src/main.ts
index 9b91b63..c3cc230 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -3,11 +3,13 @@ import App from "@/App.vue";
import { createApp, h } from "vue-demi";
import "windi.css";
+import router from "@/router";
Vue.config.productionTip = false;
Vue.config.devtools = true;
const app = createApp({
+ router,
render: () => h(App),
});
diff --git a/src/router/index.ts b/src/router/index.ts
new file mode 100644
index 0000000..b509e92
--- /dev/null
+++ b/src/router/index.ts
@@ -0,0 +1,37 @@
+import Vue from "vue";
+import VueRouter, { RouteConfig } from "vue-router";
+import Home from "@/views/Home.vue";
+import About from "@/views/About.vue";
+import NotFound from "@/views/NotFound.vue";
+
+Vue.use(VueRouter);
+
+export const routes: RouteConfig[] = [
+ {
+ path: "/",
+ name: "Home",
+ component: Home,
+ },
+ {
+ path: "/about",
+ name: "About",
+ // NOTE: you can also apply meta information
+ // meta: {authRequired: false }
+ component: About,
+ // NOTE: you can also lazy-load the component
+ // component: () => import("@/views/About.vue")
+ },
+ {
+ path: "/:path(.*)",
+ name: "NotFound",
+ component: NotFound,
+ },
+];
+
+const router = new VueRouter({
+ base: "/",
+ mode: "history",
+ routes,
+});
+
+export default router;
diff --git a/src/views/About.vue b/src/views/About.vue
new file mode 100644
index 0000000..d5c4424
--- /dev/null
+++ b/src/views/About.vue
@@ -0,0 +1,29 @@
+
+
+
+
+ About: Vite ⚡ - Vue 2 starter template
+
+ + This starter template will help you to easily create a Vue2 + application bundled by the lightning fast build tool called Vite. + Besides Vite this template also provides typescript support, + TailwindCSS, vue-router and the vue composition-api for Vue2. +
+
+
+
+
+
+
+
+
diff --git a/src/views/NotFound.vue b/src/views/NotFound.vue
new file mode 100644
index 0000000..7b02a16
--- /dev/null
+++ b/src/views/NotFound.vue
@@ -0,0 +1,26 @@
+
+
+ 
+
+
+
+ 404 NOT FOUND
+
+ + Oops, looks like you got kidnapped by aliens. +
+
+
+ Bring me back Home
+
+
+