webstorm开发vue项目快捷跳转到vue文件

各位在使用webstorm开发vue项目的时候不知道有没有遇到过这样的问题：import引入了一个vue组件或api js文件，按住Ctrl键再单击，发现无法跳转到对应文件！！

例如：

• 正常是可以跳转过去的！！！
  想要解决的话也很简单：

在项目的根目录增加jsconfig.json文件即可，

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"],
      "~/*": ["./*"]
    },
    "allowSyntheticDefaultImports": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules"]
}

为了保险起见，可以在.config.js文件配置以下内容：

 resolve: {
            // https://cn.vitejs.dev/config/#resolve-alias
            alias: {
                // 设置路径
                '~': path.resolve(__dirname, './'),
                // 设置别名
                '@': path.resolve(__dirname, './src')
            },
            // https://cn.vitejs.dev/config/#resolve-extensions
            extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue']
        },

以上，就大功告成了！！！