Feat: basic routing
This commit is contained in:
parent
28a58c43db
commit
e0d4ff6cc6
33
package-lock.json
generated
33
package-lock.json
generated
@ -10,7 +10,7 @@
|
||||
"dependencies": {
|
||||
"core-js": "^3.6.5",
|
||||
"vue": "^3.0.0",
|
||||
"vue-router": "^3.5.1"
|
||||
"vue-router": "^4.0.8"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/cli-plugin-babel": "~4.5.0",
|
||||
@ -2901,6 +2901,11 @@
|
||||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/@vue/devtools-api": {
|
||||
"version": "6.0.0-beta.13",
|
||||
"resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.0.0-beta.13.tgz",
|
||||
"integrity": "sha512-oZ0n/N4UWpkMvbR1OrBtu+YhaVADo+bYX5lxo9tou7h10p0+v2K9yzzaZATVr0lqHb7iY1wALfO8yojwg0MTHw=="
|
||||
},
|
||||
"node_modules/@vue/preload-webpack-plugin": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/@vue/preload-webpack-plugin/-/preload-webpack-plugin-1.1.2.tgz",
|
||||
@ -18357,9 +18362,15 @@
|
||||
}
|
||||
},
|
||||
"node_modules/vue-router": {
|
||||
"version": "3.5.1",
|
||||
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.1.tgz",
|
||||
"integrity": "sha512-RRQNLT8Mzr8z7eL4p7BtKvRaTSGdCbTy2+Mm5HTJvLGYSSeG9gDzNasJPP/yOYKLy+/cLG/ftrqq5fvkFwBJEw=="
|
||||
"version": "4.0.8",
|
||||
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.0.8.tgz",
|
||||
"integrity": "sha512-42mWSQaH7CCBQDspQTHv63f34VEnZC20g9QNK4WJ/zW8SdIUeT6TQ2i/78fjF/pVBUPLBWrGhvB7uDnaz7O/pA==",
|
||||
"dependencies": {
|
||||
"@vue/devtools-api": "^6.0.0-beta.10"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"vue": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/vue-style-loader": {
|
||||
"version": "4.1.3",
|
||||
@ -21468,6 +21479,11 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"@vue/devtools-api": {
|
||||
"version": "6.0.0-beta.13",
|
||||
"resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.0.0-beta.13.tgz",
|
||||
"integrity": "sha512-oZ0n/N4UWpkMvbR1OrBtu+YhaVADo+bYX5lxo9tou7h10p0+v2K9yzzaZATVr0lqHb7iY1wALfO8yojwg0MTHw=="
|
||||
},
|
||||
"@vue/preload-webpack-plugin": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/@vue/preload-webpack-plugin/-/preload-webpack-plugin-1.1.2.tgz",
|
||||
@ -33077,9 +33093,12 @@
|
||||
}
|
||||
},
|
||||
"vue-router": {
|
||||
"version": "3.5.1",
|
||||
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.1.tgz",
|
||||
"integrity": "sha512-RRQNLT8Mzr8z7eL4p7BtKvRaTSGdCbTy2+Mm5HTJvLGYSSeG9gDzNasJPP/yOYKLy+/cLG/ftrqq5fvkFwBJEw=="
|
||||
"version": "4.0.8",
|
||||
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.0.8.tgz",
|
||||
"integrity": "sha512-42mWSQaH7CCBQDspQTHv63f34VEnZC20g9QNK4WJ/zW8SdIUeT6TQ2i/78fjF/pVBUPLBWrGhvB7uDnaz7O/pA==",
|
||||
"requires": {
|
||||
"@vue/devtools-api": "^6.0.0-beta.10"
|
||||
}
|
||||
},
|
||||
"vue-style-loader": {
|
||||
"version": "4.1.3",
|
||||
|
@ -15,7 +15,7 @@
|
||||
"dependencies": {
|
||||
"core-js": "^3.6.5",
|
||||
"vue": "^3.0.0",
|
||||
"vue-router": "^3.5.1"
|
||||
"vue-router": "^4.0.8"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/cli-plugin-babel": "~4.5.0",
|
||||
|
@ -1,16 +1,14 @@
|
||||
<template>
|
||||
<Nav></Nav>
|
||||
<Content></Content>
|
||||
<router-view></router-view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Content from './components/content.vue'
|
||||
import Nav from './components/nav.vue'
|
||||
|
||||
export default {
|
||||
name: 'App',
|
||||
components: {
|
||||
Content,
|
||||
Nav
|
||||
}
|
||||
}
|
||||
|
@ -1,9 +1,7 @@
|
||||
<template>
|
||||
<nav>
|
||||
<ul>
|
||||
<li>Plop</li>
|
||||
<li>Pipo</li>
|
||||
</ul>
|
||||
<router-link to="/"> Home </router-link>
|
||||
<router-link to="/config"> Config </router-link>
|
||||
</nav>
|
||||
</template>
|
||||
|
||||
|
@ -1,7 +1,8 @@
|
||||
import { createApp } from 'vue'
|
||||
import VueRouter from "vue-router"
|
||||
import App from './App.vue'
|
||||
import App from '@/App.vue'
|
||||
import router from '@/router'
|
||||
|
||||
vue.use(VueRouter)
|
||||
|
||||
createApp(App).mount('#app')
|
||||
const app = createApp(App)
|
||||
app.use(router)
|
||||
app.mount('#app')
|
||||
|
20
src/router.js
Normal file
20
src/router.js
Normal file
@ -0,0 +1,20 @@
|
||||
import { createRouter, createWebHistory } from 'vue-router'
|
||||
|
||||
import Home from "@/views/home.vue"
|
||||
import Config from "@/views/config.vue"
|
||||
|
||||
const routes = [
|
||||
{
|
||||
path: '/',
|
||||
name: 'home',
|
||||
component: Home
|
||||
},
|
||||
{
|
||||
path: '/config',
|
||||
name: 'config',
|
||||
component: Config
|
||||
}
|
||||
]
|
||||
|
||||
const router = createRouter({ history: createWebHistory(), routes })
|
||||
export default router
|
3
src/views/config.vue
Normal file
3
src/views/config.vue
Normal file
@ -0,0 +1,3 @@
|
||||
<template>
|
||||
<h1>Config</h1>
|
||||
</template>
|
3
src/views/home.vue
Normal file
3
src/views/home.vue
Normal file
@ -0,0 +1,3 @@
|
||||
<template>
|
||||
<h1>Home</h1>
|
||||
</template>
|
15
yarn.lock
15
yarn.lock
@ -1532,6 +1532,11 @@
|
||||
optionalDependencies:
|
||||
"prettier" "^1.18.2"
|
||||
|
||||
"@vue/devtools-api@^6.0.0-beta.10":
|
||||
"integrity" "sha512-oZ0n/N4UWpkMvbR1OrBtu+YhaVADo+bYX5lxo9tou7h10p0+v2K9yzzaZATVr0lqHb7iY1wALfO8yojwg0MTHw=="
|
||||
"resolved" "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.0.0-beta.13.tgz"
|
||||
"version" "6.0.0-beta.13"
|
||||
|
||||
"@vue/preload-webpack-plugin@^1.1.0":
|
||||
"integrity" "sha512-LIZMuJk38pk9U9Ur4YzHjlIyMuxPlACdBIHH9/nGYVTsaGKOSnSuELiE8vS9wa+dJpIYspYUOqk+L1Q4pgHQHQ=="
|
||||
"resolved" "https://registry.npmjs.org/@vue/preload-webpack-plugin/-/preload-webpack-plugin-1.1.2.tgz"
|
||||
@ -9856,10 +9861,12 @@
|
||||
"vue-hot-reload-api" "^2.3.0"
|
||||
"vue-style-loader" "^4.1.0"
|
||||
|
||||
"vue-router@^3.5.1":
|
||||
"integrity" "sha512-RRQNLT8Mzr8z7eL4p7BtKvRaTSGdCbTy2+Mm5HTJvLGYSSeG9gDzNasJPP/yOYKLy+/cLG/ftrqq5fvkFwBJEw=="
|
||||
"resolved" "https://registry.npmjs.org/vue-router/-/vue-router-3.5.1.tgz"
|
||||
"version" "3.5.1"
|
||||
"vue-router@^4.0.8":
|
||||
"integrity" "sha512-42mWSQaH7CCBQDspQTHv63f34VEnZC20g9QNK4WJ/zW8SdIUeT6TQ2i/78fjF/pVBUPLBWrGhvB7uDnaz7O/pA=="
|
||||
"resolved" "https://registry.npmjs.org/vue-router/-/vue-router-4.0.8.tgz"
|
||||
"version" "4.0.8"
|
||||
dependencies:
|
||||
"@vue/devtools-api" "^6.0.0-beta.10"
|
||||
|
||||
"vue-style-loader@^4.1.0", "vue-style-loader@^4.1.2":
|
||||
"integrity" "sha512-sFuh0xfbtpRlKfm39ss/ikqs9AbKCoXZBpHeVZ8Tx650o0k0q/YCM7FRvigtxpACezfq6af+a7JeqVTWvncqDg=="
|
||||
|
Loading…
Reference in New Issue
Block a user