-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
94 lines (83 loc) · 1.93 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
<!DOCTYPE html>
<html>
<head>
<title>Modular vue i18n</title>
<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
<script src="https://unpkg.com/vue-i18n/dist/vue-i18n.js"></script>
</head>
<body>
<div id="app">
</div>
<script type="module">
import { languageGuard } from './guards.js';
import { ModularVueI18n } from './i18n.js';
import Main from './main.js';
import Home from './home.js';
import baseLangs from './lang/index.js';
import Houses from './modules/houses/main.js';
import houseLangs from './modules/houses/lang/index.js';
import Cars from './modules/cars/main.js';
import carLangs from './modules/cars/lang/index.js';
Vue.use(VueRouter)
const i18n = new ModularVueI18n({
locale: 'en',
fallbackLocale: 'en',
modules: {
base: baseLangs,
},
});
i18n.allowedLocales = ['en', 'es']
const routes = [
{
path: '/:lang',
name: 'home',
component: Home,
props: true,
},
{
path: '/:lang/houses',
name: 'houses',
component: Houses,
props: true,
meta: {
localeModules: {
houses: houseLangs,
},
},
},
{
path: '/:lang/cars',
name: 'cars',
component: Cars,
props: true,
meta: {
localeModules: {
cars: carLangs,
},
},
},
{
path: '*',
name: 'notFound',
redirect: to => '/en',
},
]
const router = new VueRouter({
base: 'modular-vue-i18n-example',
routes,
})
languageGuard(router, i18n)
const app = new Vue({
i18n,
router,
render: h => h(Main),
})
app.$router.onReady(() => {
app.$i18n.onReady(() => {
app.$mount('#app');
});
});
</script>
</body>
</html>