【Vite+Ts+Vue3+Pinia】使用i18n国际化简单配置

★雨潇★

已于 2024-02-28 09:41:05 修改

阅读量1.2k

点赞数 21

CC 4.0 BY-SA版权

分类专栏： Vue.js 文章标签： vue.js javascript 前端

于 2024-01-30 08:00:00 首次发布

本文链接：https://blog.csdn.net/yasyList/article/details/135918562

安装i18n

cnpm install vue-i18n --save

src目录新建language文件夹并新建以下文件

新建en.ts（英文）

const messages = {
   
  home: {
   
    title: "Book Store",
    hint: "Computer Science And Software Engineering",
    guessYouLike: "Guess You Like",
  },
};
export default messages;

新建zh.ts（中文）

const messages = {
   
  home: {
   
    title: "1111",
    hint: "计算机",
    guessYouLike: "喜欢",
  },
};
export default messages;

其他的语言自行新建即可

新建i18n.ts

import {
    createI18n } from "vue-i18n";

// 引入上面新建的语言文件
import en from "./en";
import zhTW from "./zhTW";

import {
    createPinia } from "pinia";
import {
    useCounterStore } from "@/store";

const i18n