React Native中如何加载Day.js的所有本地化语言包？

方案1：手动导入指定语言包（适合有限语言场景） #

如果你的项目仅需支持部分语言，直接在项目入口文件（如main.js/main.ts）一次性导入所需语言包，之后即可按需切换：

// 导入Day.js核心及目标语言包
import dayjs from 'dayjs'
import 'dayjs/locale/zh-cn'
import 'dayjs/locale/en'
import 'dayjs/locale/ja'

// 切换语言方法
const switchLocale = (currentLocale) => {
  dayjs.locale(currentLocale)
}

方案2：批量导入所有语言包（适合全语言支持场景） #

如果需要覆盖Day.js所有本地化语言，可借助构建工具的批量导入能力实现：

Webpack环境 #

import dayjs from 'dayjs'

// 通过require.context批量加载locale目录下所有js文件
const locales = require.context('dayjs/locale', true, /\.js$/)
locales.keys().forEach(key => {
  // 提取语言标识，如从'./zh-cn.js'中获取'zh-cn'
  const localeName = key.replace('./', '').replace('.js', '')
  locales(key)
})

// 切换语言
dayjs.locale(currentLocale)

Vite环境 #

import dayjs from 'dayjs'

// 使用import.meta.glob批量匹配所有locale文件
const locales = import.meta.glob('dayjs/locale/*.js')

// 预加载所有语言包
for (const path in locales) {
  await locales[path]()
}

// 切换语言
dayjs.locale(currentLocale)

关于之前动态导入报错的说明 #

你之前使用的import(dayjs/locale/${currentLocale})属于运行时动态导入，这种方式要求构建工具能提前枚举可能的导入路径。如果currentLocale是完全无限制的动态变量，构建工具无法在编译阶段确定要打包哪些文件，就会抛出错误。而编译时加载的方式是提前将所有目标语言包打包进代码，从根源避免了运行时的动态解析问题。

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