PhpStorm无法解析Vue项目$root下定义的全局方法如何解决？

PhpStorm 支持识别挂载到 Vue 根实例/原型上的全局方法，完成以下配置即可实现代码提示与定义跳转：

• 方案一：新增全局类型声明文件（推荐，可适配所有自定义全局属性场景）
  在项目根目录新建 vue.d.ts 类型声明文件，按你使用的Vue版本写入对应内容：

  • Vue2 项目写法：

  import Vue from 'vue'
  
  declare module 'vue/types/vue' {
    interface Vue {
      // 按实际业务修改mf方法的参数、返回值类型
      mf: (param?: any) => any
    }
  }
  

  • Vue3 项目写法：

  declare module '@vue/runtime-core' {
    interface ComponentCustomProperties {
      // 按实际业务修改mf方法的参数、返回值类型
      mf: (param?: any) => any
    }
  }
  export {}
  

• 方案二：调整全局方法挂载逻辑
  若你当前是在根Vue实例的配置项中直接定义mf方法，可改为挂载到Vue原型上，PhpStorm可默认识别该类挂载的方法：

  // app.js 中修改挂载方式
  // 原有写法示例（识别性差）
  new Vue({
    methods: {
      mf() {}
    }
  }).$mount('#app')
  
  // 改为原型挂载写法
  Vue.prototype.mf = function () {
    // 原有mf方法逻辑
  }
  new Vue({}).$mount('#app')
  

• 配置刷新操作
  完成上述配置后若仍未生效，可手动重建IDE索引：点击顶部菜单栏 File > Invalidate Caches...，选择 Invalidate and Restart 等待IDE重启完成即可。

内容的提问来源于stack exchange，提问作者Courses Cart