Skip to content

Commit 3e1d2da

Browse files
fuookamifuookami
committed
feature: build i18n framework.
1 parent 2470c8a commit 3e1d2da

14 files changed

+193
-12
lines changed

‎docs/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,6 @@
88
</head>
99
<body>
1010
<div id="app"></div>
11-
<script type="module" src="/src/main.js"></script>
11+
<script type="module" src="/src/main.ts"></script>
1212
</body>
1313
</html>

‎docs/package.json

+13-3
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,20 @@
99
"preview": "vite preview"
1010
},
1111
"dependencies": {
12-
"vue": "^3.4.15"
12+
"@mdi/font": "^7.4.47",
13+
"roboto-fontface": "^0.10.0",
14+
"vue": "^3.5.12",
15+
"vue-i18n": "^11.0.0-rc.1",
16+
"vuetify": "^3.7.4",
17+
"webfontloader": "^1.6.28"
1318
},
1419
"devDependencies": {
15-
"@vitejs/plugin-vue": "^4.4.0",
16-
"vite": "^4.4.0"
20+
"@types/webfontloader": "^1.0.0",
21+
"@vitejs/plugin-vue": "^5.0.5",
22+
"typescript": "^5.2.2",
23+
"vite": "^5.3.1",
24+
"vite-plugin-vuetify": "^2.0.4",
25+
"vue-cli-plugin-vuetify": "~2.5.8",
26+
"vue-tsc": "^2.0.22"
1727
}
1828
}

‎docs/src/App.vue

+64-4
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,66 @@
11
<template>
2-
<main>
3-
<h1>ospf-docs</h1>
4-
<h2>Why ospf?</h2>
5-
</main>
2+
<v-app>
3+
<v-app-bar app>
4+
<v-container>
5+
<v-row class="align-center">
6+
<v-col cols="auto">
7+
<h3 v-html="$t('home.title')"/>
8+
</v-col>
9+
<v-col class="d-flex justify-end">
10+
<v-select
11+
:items="languageItems"
12+
item-title="label"
13+
item-value="code"
14+
v-model="selectedLanguage"
15+
solo
16+
@update:modelValue="updateLanguage"
17+
></v-select>
18+
</v-col>
19+
</v-row>
20+
</v-container>
21+
</v-app-bar>
22+
<v-main>
23+
<v-context>
24+
<h4 v-html="$t('index.title')"/>
25+
<p v-html="$t('index.description')"/>
26+
</v-context>
27+
</v-main>
28+
</v-app>
629
</template>
30+
31+
<script lang="ts">
32+
import {defineComponent} from 'vue';
33+
34+
export default defineComponent({
35+
data() {
36+
return {
37+
languageItems: [
38+
{ label: '简体中文', code: 'zhCn' },
39+
{ label: 'English', code: 'en' }
40+
],
41+
selectedLanguage: 'zhCn'
42+
};
43+
},
44+
45+
created() {
46+
// 从本地存储读取用户语言偏好
47+
const savedLang = localStorage.getItem('userLanguage') || 'zhCn';
48+
this.selectedLanguage = savedLang;
49+
this.setLocale(savedLang);
50+
},
51+
52+
methods: {
53+
setLocale(language: string) {
54+
this.$i18n.locale = language;
55+
},
56+
57+
updateLanguage(language: string) {
58+
console.log(language);
59+
this.selectedLanguage = language;
60+
this.setLocale(language);
61+
// 持久化存储用户选择
62+
localStorage.setItem('userLanguage', language);
63+
}
64+
}
65+
});
66+
</script>

‎docs/src/i18n/index.ts

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import { createI18n } from 'vue-i18n'
2+
// 语言包
3+
import zhCn from './lang/zh-cn'
4+
import en from './lang/en'
5+
6+
const i18n = createI18n({
7+
locale: sessionStorage.getItem('userLanguage') || 'zhCn',
8+
messages: {
9+
zhCn,
10+
en,
11+
},
12+
globalInjection: true
13+
})
14+
export default i18n

‎docs/src/i18n/lang/en.ts

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export default {
2+
home: {
3+
title: "ospf"
4+
},
5+
index: {
6+
title: "Why ospf?",
7+
description: "ospf is a solution for the modeling and coding process in developing complex operational research algorithm software, along with its development components. It aims to provide a modeling approach based on <strong><em>Domain Driven Design</em></strong> (DDD), enabling users to efficiently develop and maintain mathematical models, solution algorithms, and their implementation code throughout the entire software lifecycle."
8+
}
9+
}

‎docs/src/i18n/lang/zh-cn.ts

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export default {
2+
home: {
3+
title: "ospf"
4+
},
5+
index: {
6+
title: "为什么选择 ospf?",
7+
description: "ospf 是一个针对复杂的运筹优化算法中建模与编码过程的解决方案及其开发组件。ospf 旨在提供一种基于<b><em>领域驱动设计</em></b>（DDD）的建模方式，以便使用者能够在整个软件生命周期都能简单、高效地开发、维护数学模型、求解算法及其实现代码。"
8+
}
9+
}

‎docs/src/main.js

-4
This file was deleted.

‎docs/src/main.ts

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import { createApp } from 'vue'
2+
import App from './App.vue'
3+
import i18n from './i18n/index';
4+
import vuetify from './plugins/vuetify'
5+
import { loadFonts } from './plugins/webfontloader'
6+
7+
loadFonts()
8+
9+
createApp(App)
10+
.use(i18n)
11+
.use(vuetify)
12+
.mount('#app')

‎docs/src/plugins/vuetify.ts

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
// Styles
2+
import '@mdi/font/css/materialdesignicons.css'
3+
import 'vuetify/styles'
4+
5+
// Vuetify
6+
import { createVuetify } from 'vuetify'
7+
8+
export default createVuetify(
9+
// https://vuetifyjs.com/en/introduction/why-vuetify/#feature-guides
10+
)

‎docs/src/plugins/webfontloader.ts

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
/**
2+
* plugins/webfontloader.js
3+
*
4+
* webfontloader documentation: https://github.com/typekit/webfontloader
5+
*/
6+
7+
export async function loadFonts () {
8+
const webFontLoader = await import(/* webpackChunkName: "webfontloader" */'webfontloader')
9+
10+
webFontLoader.load({
11+
google: {
12+
families: ['Roboto:100,300,400,500,700,900&display=swap'],
13+
},
14+
})
15+
}

‎docs/src/vite-env.d.ts

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
/// <reference types="vite/client" />
2+
3+
declare module "*.vue" {
4+
import type { DefineComponent } from "vue";
5+
const component: DefineComponent<{}, {}, any>;
6+
export default component;
7+
}

‎docs/tsconfig.json

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
{
2+
"compilerOptions": {
3+
"target": "ES2020",
4+
"useDefineForClassFields": true,
5+
"module": "ESNext",
6+
"lib": ["ES2020", "DOM", "DOM.Iterable"],
7+
"skipLibCheck": true,
8+
9+
/* Bundler mode */
10+
"moduleResolution": "bundler",
11+
"allowImportingTsExtensions": true,
12+
"resolveJsonModule": true,
13+
"isolatedModules": true,
14+
"noEmit": true,
15+
"jsx": "preserve",
16+
17+
/* Linting */
18+
"strict": true,
19+
"noUnusedLocals": true,
20+
"noUnusedParameters": true,
21+
"noFallthroughCasesInSwitch": true
22+
},
23+
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
24+
"references": [{ "path": "./tsconfig.node.json" }],
25+
}

‎docs/tsconfig.node.json

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"compilerOptions": {
3+
"composite": true,
4+
"skipLibCheck": true,
5+
"module": "ESNext",
6+
"moduleResolution": "bundler",
7+
"allowSyntheticDefaultImports": true
8+
},
9+
"include": ["vite.config.ts"]
10+
}

‎docs/vite.config.js

+4
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,14 @@ import { fileURLToPath, URL } from 'node:url'
33
import { defineConfig } from 'vite'
44
import vue from '@vitejs/plugin-vue'
55

6+
// https://github.com/vuetifyjs/vuetify-loader/tree/next/packages/vite-plugin
7+
import vuetify from 'vite-plugin-vuetify'
8+
69
// https://vitejs.dev/config/
710
export default defineConfig({
811
plugins: [
912
vue(),
13+
vuetify({ autoImport: true }),
1014
],
1115
base:'./',
1216
resolve: {

0 commit comments

Comments
 (0)