Hover I18n Hint - 国际化提示

功能介绍

这是一个 VSCode 插件，能在代码编辑器中悬停在国际化 key（如 l0359）上时显示对应的中文文案，提高开发效率。

主要特性

✅ 悬停提示：鼠标悬停在国际化 key 上时显示对应的中文文案
✅ 智能识别：支持多种格式的国际化 key（l0359, L0359, 'l0359', "l0359", {l0359}）
✅ 多文件支持：自动查找并加载项目中的国际化资源文件
✅ 多格式支持：支持多种格式的国际化资源文件，包括常见的IIFE格式
✅ 绝对路径支持：可以使用绝对路径直接指向资源文件
✅ 实时更新：监听资源文件变更，自动更新提示内容
✅ 高性能：针对大文件做了性能优化，不影响编辑器体验
✅ 可配置：支持自定义资源文件路径、key 格式等
✅ 诊断工具：内置诊断命令，帮助排查和解决资源加载问题
✅ 实时监听：自动监听国际化资源文件变化，无需重启即可更新提示

安装方法

从 VS Code 扩展商店安装

打开 VS Code
点击左侧扩展图标
搜索 "Hover I18n Hint"
点击 "安装" 按钮

从 VSIX 文件安装

下载最新的 .vsix 文件
在 VS Code 中，选择 "扩展" -> "从 VSIX 安装..."
选择下载的 .vsix 文件

使用方法

插件会自动在工作区中查找国际化资源文件（默认路径：app/iframe/locale/zh.js）。如果找到了资源文件，则会自动加载并在编辑器中启用悬停提示功能。

交互方式：将鼠标悬停在国际化 key 上，会显示一个带有中文文案的提示框。

支持的文件类型

JavaScript (.js)
TypeScript (.ts)
React (.jsx, .tsx)
Vue (.vue)
HTML (.html)
JSON (.json)

支持的 key 格式

直接使用：l0359, L0359
字符串形式：'l0359', "l0359"
对象访问形式：R['l0359'], R["l0359"], R.l0359
window访问形式：window.LanData.R['l0359'], LanData.R['l0359']
函数调用形式：t('l0359'), i18n.t('l0359')
JSX 中使用：{l0359}
对象属性：strings.l0359

支持的资源文件格式

插件支持多种常见的国际化资源文件格式：

IIFE格式（立即执行函数）

(function(window){
    var zhCn={
        name:'zhCn',
        R:{
            'l0001':'搜索',
            'l0025': '病案等级',
            // ...
        }
    }
    window.LanData = zhCn;
})(this)

导出对象格式

export default {
  l0001: '搜索',
  l0002: '保存',
  // ...
}

CommonJS格式

module.exports = {
  l0001: '搜索',
  l0002: '保存',
  // ...
}

常量对象格式

const R = {
  l0001: '搜索',
  l0002: '保存',
  // ...
}

配置选项

可以在 VS Code 的设置中配置以下选项：

配置项	说明	默认值
`hoverShowDes.i18nFilePath`	国际化资源文件路径（相对于工作区或绝对路径）	`app/iframe/locale/zh.js`
`hoverShowDes.enabled`	启用/禁用国际化提示	`true`
`hoverShowDes.showInlineText`	是否在国际化标记后直接显示对应文案	`true`

命令

可以通过命令面板（Ctrl+Shift+P 或 Cmd+Shift+P）执行以下命令：

HoverShowDes: 刷新国际化资源：手动刷新国际化资源并更新提示
HoverShowDes: 切换国际化提示：启用/禁用提示功能

常见问题

没有显示提示

检查是否正确安装并启用了插件
确认当前文件类型是否受支持
尝试将鼠标精确地悬停在国际化key上（必须直接悬停在key文本上）
尝试手动指定国际化资源文件的绝对路径
执行 HoverShowDes: 刷新国际化资源 命令
查看VSCode输出面板中的插件日志

识别到的 key 数量不正确

检查 zh.js 文件格式是否符合插件支持的格式
查看输出面板中的日志，确认资源文件是否被正确加载
可能需要调整正则表达式以匹配项目中使用的特定key格式

为什么改用悬停方式显示？

之前的行内装饰器方式在处理多个国际化key时容易出现文本重叠和错乱问题，特别是在大文件或复杂格式下。悬停显示方式更可靠，不会影响代码视图的整洁度，同时提供更好的性能和用户体验。

更新zh.js后提示没有更新

当你更新zh.js文件后，插件会自动检测变化并重新加载资源。如果没有自动更新，你可以：

等待几秒钟，文件系统监听器有时会有短暂延迟
执行 HoverShowDes: 刷新国际化资源 命令手动刷新
确保修改的zh.js文件是插件正在使用的那个（可以查看输出面板中的日志确认）

反馈与贡献

欢迎提交问题和建议，或者参与项目开发：

许可证

MIT