检查和配置 Vue I18n

确保你已经正确安装了Vue I18n并且配置了组合API模式。

安装 Vue I18n

npm install vue-i18n@next

配置 i18n.js

import { createI18n } from 'vue-i18n';
import messages from './messages';

const i18n = createI18n({
  legacy: false, // 使用组合 API 模式
  locale: 'en', // 设置默认语言
  messages, // 多语言内容
});

export default i18n;

如果没有配置 legacy: false，使用会报错。

如果你的多语言文件是 message.js，那么可以按照上图进行配置。

如果你是这样子的写法，或者其他的语法：

那么，你的js配置就要改一下了：

import { createI18n } from 'vue-i18n';
import en from "@/i18n/en";
import zh from "@/i18n/zh";

const i18n = createI18n({
    legacy: false,
    locale: 'en', // 设置默认语言
    messages: {en, zh},
});

export default i18n;

messages这个key显示的写出来，不然页面一直显示的key，不会显示对应的文本。