mettre routes dans main.js et creer testparametreurl

science-quest/src/components/TestParametreURL.vue

@@ -0,0 +1,3 @@
+<template>
+    <div>{{ $route.params.id }}</div>
+</template>

science-quest/src/main.js

@@ -1,6 +1,25 @@
 import './assets/main.css'
 
+import { createRouter, createWebHashHistory } from 'vue-router'
 import { createApp } from 'vue'
 import App from './App.vue'
 
-createApp(App).mount('#app')
+//importer les components pour le routing
+import PagePrincipale from "./components/PagePrincipale.vue"
+import NotFound from "./components/erreurs/NotFound.vue"
+import TestParametreURL from "./components/TestParametreURL.vue"
+
+const routes = [
+    { path: '/', component: PagePrincipale },
+    { path: '/exemple/:id', component: TestParametreURL },
+    { path: '/:pathMatch(.*)*', name: 'NotFound', component: NotFound },
+]
+
+const router = createRouter({
+    // 4. Provide the history implementation to use. We
+    // are using the hash history for simplicity here.
+    history: createWebHashHistory(),
+    routes, // short for `routes: routes`
+})
+
+createApp(App).use(router).mount('#app')