mirror of
https://github.com/kevin-DL/wails-vue-template.git
synced 2026-01-11 18:04:32 +00:00
Add vue-router
Add home page
This commit is contained in:
@@ -9,10 +9,11 @@
|
|||||||
"preview": "vite preview"
|
"preview": "vite preview"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"vue": "^3.2.37"
|
"vue": "^3.2.37",
|
||||||
|
"vue-router": "^4.3.2"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@vitejs/plugin-vue": "^3.0.3",
|
"@vitejs/plugin-vue": "^3.0.3",
|
||||||
"vite": "^3.0.7"
|
"vite": "^3.0.7"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,21 +1,11 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import HelloWorld from './components/HelloWorld.vue'</script>
|
import { RouterView } from 'vue-router'
|
||||||
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<img id="logo" alt="Wails logo" src="./assets/images/logo-universal.png"/>
|
<main>
|
||||||
<HelloWorld/>
|
<RouterView />
|
||||||
|
</main>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style>
|
<style></style>
|
||||||
#logo {
|
|
||||||
display: block;
|
|
||||||
width: 50%;
|
|
||||||
height: 50%;
|
|
||||||
margin: auto;
|
|
||||||
padding: 10% 0 0;
|
|
||||||
background-position: center;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
background-origin: content-box;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|||||||
@@ -1,5 +1,22 @@
|
|||||||
import {createApp} from 'vue'
|
import { createApp } from 'vue'
|
||||||
|
import { createWebHashHistory, createRouter } from 'vue-router'
|
||||||
import App from './App.vue'
|
import App from './App.vue'
|
||||||
import './style.css';
|
import './style.css';
|
||||||
|
|
||||||
createApp(App).mount('#app')
|
const routes = [
|
||||||
|
{
|
||||||
|
path: '/',
|
||||||
|
name: 'home',
|
||||||
|
component: () => import('./pages/Index.vue')
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
const router = createRouter({
|
||||||
|
history: createWebHashHistory(),
|
||||||
|
routes
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
createApp(App)
|
||||||
|
.use(router)
|
||||||
|
.mount('#app')
|
||||||
|
|||||||
@@ -1,26 +1,3 @@
|
|||||||
html {
|
|
||||||
background-color: rgba(27, 38, 54, 1);
|
|
||||||
text-align: center;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
margin: 0;
|
|
||||||
color: white;
|
|
||||||
font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
|
|
||||||
"Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
|
|
||||||
sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: "Nunito";
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
src: local(""),
|
|
||||||
url("assets/fonts/nunito-v16-latin-regular.woff2") format("woff2");
|
|
||||||
}
|
|
||||||
|
|
||||||
#app {
|
#app {
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
text-align: center;
|
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user