add router plugin & base routes file and views

app/package-lock.json

@@ -10890,6 +10890,11 @@
         }
       }
     },
+    "vue-router": {
+      "version": "3.3.4",
+      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.3.4.tgz",
+      "integrity": "sha512-SdKRBeoXUjaZ9R/8AyxsdTqkOfMcI5tWxPZOUX5Ie1BTL5rPSZ0O++pbiZCeYeythiZIdLEfkDiQPKIaWk5hDg=="
+    },
     "vue-style-loader": {
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.2.tgz",

app/package.json

@@ -14,11 +14,13 @@
     "bootstrap-vue": "^2.1.0",
     "core-js": "^3.6.5",
     "vue": "^2.6.11",
-    "vue-i18n": "^8.17.3"
+    "vue-i18n": "^8.17.3",
+    "vue-router": "^3.2.0"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "~4.4.0",
     "@vue/cli-plugin-eslint": "~4.4.0",
+    "@vue/cli-plugin-router": "^4.4.6",
     "@vue/cli-service": "~4.4.0",
     "babel-eslint": "^10.1.0",
     "bootstrap": "^4.3.1",

app/src/App.vue

@@ -1,14 +1,10 @@
 <template>
     <div id="app">
-    <p>{{ $t('user_interface_link') }}</p>
+        <nav>
+            <b-nav>
+                <b-nav-item to="/" exact exact-active-class="active">Home</b-nav-item>
+            </b-nav>
+        </nav>
+        <router-view/>
     </div>
 </template>
-
-<script>
-export default {
-  name: 'App',
-}
-</script>
-
-<style>
-</style>

app/src/main.js

@@ -1,11 +1,14 @@
 import Vue from 'vue'
-import './plugins/bootstrap-vue'
 import App from './App.vue'
+import './plugins/bootstrap-vue'
 import i18n from './plugins/i18n'
+import router from './plugins/router'
+
 
 Vue.config.productionTip = false
 
 new Vue({
     i18n,
+    router,
     render: h => h(App)
 }).$mount('#app')

app/src/plugins/i18n.js

@@ -1,6 +1,7 @@
 import Vue from 'vue'
 import VueI18n from 'vue-i18n'
 
+
 Vue.use(VueI18n)
 
 function loadLocaleMessages () {
@@ -22,13 +23,13 @@ function getBrowserLocale() {
         : navigator.language
 
     return !navigatorLocale
-        ? undefined
+        ? process.env.VUE_APP_I18N_LOCALE || 'en'
         : navigatorLocale
 }
 
 export default new VueI18n({
     locale: getBrowserLocale(),
-  fallbackLocale: 'en',
+    fallbackLocale: process.env.VUE_APP_I18N_FALLBACK_LOCALE || 'en',
     // TODO : chunk locales json and lazy load them
     messages: loadLocaleMessages()
 })

app/src/plugins/router.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import VueRouter from 'vue-router'
+import routes from '../routes'
+
+
+Vue.use(VueRouter)
+
+export default new VueRouter({
+    mode: 'history',
+    base: process.env.BASE_URL,
+    routes
+})

app/src/routes.js

@@ -0,0 +1,12 @@
+import Home from './views/Home'
+
+
+const routes = [
+    {
+        path: '/',
+        name: 'Home',
+        component: Home
+    },
+]
+
+export default routes

app/src/views/Home.vue

@@ -0,0 +1,11 @@
+<template>
+  <div class="home">
+    <img alt="Yunohost logo" src="../assets/logo.png">
+  </div>
+</template>
+
+<script>
+export default {
+    name: 'Home',
+}
+</script>