前端实现多语言

首先，创建一个 Vue 项目并安装 vue-i18n 库

vue create vue-multilanguage-app
cd vue-multilanguage-app
npm install vue-i18n

1. 在 src 目录下创建一个 i18n 文件夹，然后在该文件夹下创建一个 index.js 文件，用来配置多语言支持：

2. // src/i18n/index.js
   import Vue from 'vue';
   import VueI18n from 'vue-i18n';
   
   Vue.use(VueI18n);
   
   const messages = {
     en: {
       greeting: 'Hello, World!',
     },
     fr: {
       greeting: 'Bonjour le monde!',
     },
   };
   
   const i18n = new VueI18n({
     locale: 'en',
     messages,
   });
   
   export default i18n;
   

3. 创建一个组件 HelloWorld.vue，用来展示多语言文本：
5. 在根组件 App.vue 中引入 HelloWorld.vue 组件，并注入 vue-i18n 实例：
7. 最后，在 main.js 中导入 vue-i18n 实例，并挂载应用：

8. import Vue from 'vue';
   import App from './App.vue';
   import i18n from './i18n';
   
   new Vue({
     i18n,
     render: (h) => h(App),
   }).$mount('#app');
   

   这样前端就实现多语言的功能