使用Webpack tilde别名时通过vim中的“gf”解析javascript模块

我是一个使用tilde的vue.js项目的新成员( ~ )模块导入中的符号,如

import WhateverApi from '~/api/whatever';

项目存储库包含所有类型的文件,所有这些文件都被放在一起:一台移动机器、一个Laravel后端应用程序、配置文件和一个Vue.js SPA。后者位于嵌套的文件夹结构中( resources/assets/js/ ,应解释为项目根目录,因此 ~ .

使用vim,我习惯了通过 gf .当我在上面显示的路径上这样做时,Vim抱怨文件不存在,因为它可能会将tilde(稍微正确地)解释为用户的主文件夹。

谷歌没有结果,主要是因为我不知道该搜索什么。这似乎是一些神奇的Webpack正在做的。因为其他团队成员使用webstorm/phpsorm,所以他们没有这个问题。

如何让VIM在项目范围内正确地解析路径?

用示例更新:

Webpack有一个别名设置,允许将任何路径定义为要在源代码文件中使用的别名。看起来是这样的:

resolve: {
    alias: {
        vue$: 'vue/dist/vue.esm.js',
        '~': path.resolve(__dirname, 'resources/assets/js'),
        sass: path.resolve(__dirname, 'resources/assets/sass'),
    },
    extensions: ['*', '.js', '.vue', '.json'],
},

忽略 $vue 键,它特定于带有Webpack的Vue.js。 ~ 和 sass 很有趣。第一个基本上是一个替换过滤器,它可以交换 ~ 在通往 resources/assets/js .同样适用于 国税局 根据路径。但是,import语句不同。下面是一个带有两个import语句的Vue单个文件组件示例:

<template>
    <div>
        <p>Some content.</p>
    </div>
</template>

<script>
    import WhateverApi from '~/api/whatever';

    export default {};
</script>

<style lang="scss" scoped>
    @import '~sass/variables/all';
</style>

现在,当使用 广发 ,如果它能够根据以下规则解决这些(奇怪的)组合,那将是非常棒的:

• 以开始的路径 ~/ 应更换 ~ 到 资源/资产/JS 并尝试通过附加扩展名来查找文件 .js ,请 .vue 和 .json .
• 以开始的路径 ~sass 应更换 ~ 到 resources/assets/sass 并尝试通过附加扩展名来查找文件 .scss .

我知道这件事和我加入团队之前发生的事情有关。有一个有趣的项目试图简化这个( https://github.com/davidosomething/vim-enhanced-resolver )但不幸的是,它似乎被破坏了,因为它抛出了试图解决现有路径的错误。

非常感谢您的帮助。