Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>Import Version HintNew to Visual Studio Code? Get it now.
Import Version Hint

Import Version Hint

xulai

|
3 installs
| (1) | Free
Show package version hint next to import or require
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Import Version Hint

插件简介

Import Version Hint 是一款 VS Code 插件,能在 JavaScript 和 TypeScript 文件中的 import 或 require 语句旁边显示对应依赖包的版本号,帮助开发者快速查看和确认所使用的依赖版本,提高开发效率和代码可维护性。

📸 Screenshots

screenshot


功能特性

  • 自动解析项目 package.json 中的依赖版本信息
  • 在导入语句旁边以装饰形式显示版本号
  • 支持自定义版本号提示颜色,增强视觉识别
  • 可配置是否去除版本号前缀符号(如 ^、~、>= 等)
  • 支持仅在鼠标悬停时显示版本号,减少编辑器视觉干扰
  • 版本号提示支持双引号包裹显示(如 "lodash@^4.17.21")

安装要求

  • VS Code 版本:>= 1.70.0
  • 适用于 JavaScript 和 TypeScript 项目

使用说明

  1. 通过 VS Code 插件市场搜索并安装 Import Version Hint
  2. 打开任意 .js、.jsx、.ts、.tsx 文件,编辑或查看 import / require 语句
  3. 版本号提示将自动显示在导入模块名旁
  4. 可通过 VS Code 设置调整插件行为和样式

配置项

配置名 类型 默认值 描述
importVersionHint.enabled boolean true 是否启用导入版本号提示
importVersionHint.decorationColor string #888 版本号提示的颜色
importVersionHint.stripVersionPrefix boolean false 是否去除版本号前缀符号(如 ^、~、>=)
importVersionHint.hoverOnly boolean false 是否仅在鼠标悬停时显示版本号提示
importVersionHint.showQuotes boolean false 是否用双引号包裹版本号提示(例如 "react@^19.0.0")

配置方式:

  • 通过 VS Code 设置 UI 搜索 importVersionHint 配置项进行修改
  • 或者在 settings.json 中添加对应配置,例如:
{
  "importVersionHint.enabled": true,
  "importVersionHint.decorationColor": "#888",
  "importVersionHint.stripVersionPrefix": false,
  "importVersionHint.hoverOnly": false,
  "importVersionHint.showQuotes": false
}

状态栏控制

插件启用后,右下角状态栏会出现图标:

  • 点击图标可以快速启用或禁用版本号显示

  • 图标显示 $(check) Import Version 表示启用,$(circle-slash) Import Version 表示禁用

版本信息

当前版本:0.0.1

作者:xulai

仓库:github

贡献与反馈

欢迎在插件仓库提交 issue 和 pull request,反馈使用问题或建议新功能。

许可协议

本插件遵循 MIT 许可证。

感谢使用 Import Version Hint,祝您编码愉快!

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft