我现在有一个老的 JFinal 后台管理系统，原来是 JFinal 后端模板页面，国际化一直使用后端 resources 里的 .properties 文件，例如：

menu.nihao=进口管理
menu.oceanTransport=海运
button.search=查询
button.add=增加
button.delete=删除

这套机制在 JFinal 模板页面里很好用，因为服务端渲染时可以直接通过 JFinal 的 I18n / Res 读取文案。

现在我准备把前端迁移成 Vue 3 + TypeScript + Vite 的单页应用。遇到的问题是：Vue/TS 跑在浏览器端，不能直接读取后端 classpath/resources 下的 JFinal 国际化 properties 文件。

如果在前端每个页面再写一套：

const zh = { search: '查询', save: '保存' }
const ja = { search: '検索', save: '保存' }
const en = { search: 'Search', save: 'Save' }

就会变成前后端维护两份国际化文案。字段、按钮、菜单、提示语很多，后期非常容易遗漏、重复、不一致。

我想请教 JFinal 社区有没有比较推荐的做法？

目前我的倾向是：

resources/i18n/frontend_zh_CN.properties
resources/i18n/frontend_ja_JP.properties
resources/i18n/frontend_en_US.properties
        ↓
Vite 构建前执行脚本
        ↓
src/generated/i18n/zh_CN.ts
src/generated/i18n/ja_JP.ts
src/generated/i18n/en_US.ts
        ↓
Vue 页面统一使用 t('button.search') / t('label.customerCode')

也就是后端 properties 仍然作为唯一文案源，前端不再手写多语言对象。

想请教这种设计在 JFinal 项目里是否合适？有没有现成工具、最佳实践或者需要避坑的地方？