vue实现版本检测

Vue 版本检测的实现方法

使用 Vue.version 属性

Vue 实例提供了全局属性 Vue.version，可以直接获取当前使用的 Vue 版本号：

console.log(Vue.version); // 输出例如 "2.6.14" 或 "3.2.47"

通过 package.json 检测

在项目根目录的 package.json 文件中可以查看 Vue 的依赖版本：

"dependencies": {
  "vue": "^2.6.14"
}

运行时环境检测

针对不同 Vue 版本的环境差异，可通过以下特征进行检测：

// 检测 Vue 2.x
if (typeof Vue !== 'undefined' && !Vue.version.startsWith('3')) {
  console.log('Vue 2.x 环境');
}

// 检测 Vue 3.x
if (typeof Vue !== 'undefined' && Vue.version.startsWith('3')) {
  console.log('Vue 3.x 环境');
}

构建时检测

通过构建工具的环境变量可以获取版本信息（需配合构建配置）：

process.env.VUE_VERSION // webpack等构建工具中

浏览器控制台检测

在浏览器开发者工具中可直接输入：

__VUE__ // Vue 2.x会返回true
__VUE_OPTIONS_API__ // Vue 3兼容模式会返回true
__VUE_PROD_DEVTOOLS__ // Vue 3生产环境devtools状态