修改默认语言后vue-i18n fallback机制失效问题排查

当浏览器默认语言对应的语言文件（比如fr.js）不存在时，import.meta.glob('./locales/*.js')生成的locales对象里不会包含该文件的键，直接调用locales[目标路径]()会因值为undefined报错，因为undefined不是函数。

先判断目标语言文件是否存在，不存在则直接使用预设的英文fallback，同时修正i18n配置的语言标识与messages结构：

import fallback from './locales/en';
let current = fallback; // 默认先赋值为英文fallback
const locales = import.meta.glob('./locales/*.js');

// 提取浏览器语言前缀（比如从'fr-FR'提取'fr'）
const langPrefix = navigator.language.split('-')[0];
const targetLocalePath = `./locales/${langPrefix}.js`;

// 检查目标文件是否存在，存在则加载，否则直接初始化
if (locales[targetLocalePath]) {
  locales[targetLocalePath]()
    .then(c => {
      current = c.default;
    })
    .catch(e => console.error(e))
    .finally(initI18n);
} else {
  initI18n();
}

// 单独封装i18n初始化逻辑
function initI18n() {
  const i18n = createI18n({
    legacy: false,
    locale: langPrefix, // 传入语言标识字符串（如'en'、'fr'）
    fallbackLocale: 'en', // 同样使用语言标识字符串
    fallbackWarn: false,
    missingWarn: false,
    messages: {
      [langPrefix]: current, // 用语言标识作为messages的键
      'en': fallback
    }
  });
  app.use(i18n);
  app.mount('#app');
}

• 初始时将current设为fallback，避免加载失败时出现空对象
• 先校验locales中是否存在目标路径，不存在则直接跳过加载逻辑
• 修正createI18n配置：locale和fallbackLocale需传入语言标识字符串而非语言对象；messages的键必须对应语言标识，确保i18n能正确识别语言配置

内容的提问来源于stack exchange，提问作者perrotss