@cherishtao/vite-plugin-langspack2
0.1.1 • Public • Published @cherishtao/vite-plugin-langspack
介绍
- 辅助一种项目国际化模式:开发阶段采用多目录结构开发,便于开发人员查看和修改;发布时采用每语言单一翻译文件独立发布方式,便于客户定制和后期修改维护
- 预览
- npmjs
安装
pnpm i -D @cherishtao/vite-plugin-langspack
用法
- 详细内容可以参考项目示例和源码;有问题请提 issue
- 补充:对于不需要区分生产模式,只要直接打包语言文件的场景,可以在 vite.config.ts 中硬指定参数 mode='development'来实现
// vite.config.ts
import vitePluginLangspack from '@lazebird/vite-plugin-langspack';
vitePlugins.push(vitePluginLangspack({ lang: { src: pathResolve('langs'), dst: pathResolve('public'), include: /.json$/ }, log: { level: 6 } }));
// 业务
import getLocaleData from 'virtual:langs';
const msgs = await getLocaleData(locale);
Todo
- [x] 去掉配置中的 mode 字段,简化配置
- [ ] 未使用的 key 的 treeshake
- [ ] 不同 key 相同翻译内容的合并
问题
Unknown variable dynamic import
- import 默认需要实体文件,因此在项目 langs/目录存在 2 个空文件 zh_CN.js 和 en_US.js;否则插件不会处理该 import 资源
- 且在外扩新语种时,比如 zh_TW,由于编译时 import 未处理该文件,也会导致出错,可选自行处理该问题,做法参考
let msgs = [];
if (import.meta.env.DEV) msgs = await (await import(`../../../langs/${locale}.js`))?.default;
else msgs = await (await axios.get(`/${locale}.json`)).data;
- 考虑后续通过虚拟模块重构来解决该问题,并且将语言作为一个参数项而非路径项
Package Sidebar
Install
npm i @cherishtao/vite-plugin-langspack2
Weekly Downloads