Question

我是Vue.js项目的新成员，该项目在模块导入中使用波浪号（~）表示法，如

import WhateverApi from '~/api/whatever';

项目存储库包含所有类型的文件，这些文件全部组合在一起：Vagrant计算机，Laravel后端应用程序，配置文件和Vue.js SPA。后者位于嵌套文件夹结构（resources/assets/js/）中，应将其解释为项目根目录，因此应解释为~。

使用Vim，我习惯于能够通过gf跳转到链接文件。当我在上面显示的路径上执行此操作时，Vim抱怨该文件不存在，因为它可能将波浪号（某种程度上正确）解释为用户的主文件夹。

Google搜索没有结果，主要是因为我不知道要搜索什么。这似乎是Webpack正在执行的操作。由于其他团队成员使用WebStorm / PHPStorm，因此他们没有此问题。

如何让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。 sass的相应路径也一样。但是，导入语句有所不同。这是一个Vue单个文件组件的示例，其中以两个import语句为例：

<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>

现在，当使用gf时，如果能够根据以下规则解决那些（奇怪的）组合，那就太棒了：

以~/开头的路径应将~替换为resources/assets/js，并尝试通过附加扩展名.js，.vue和.json来查找文件。
以~sass开头的路径应将~替换为resources/assets/sass，并尝试通过附加扩展名.scss来查找文件。

我知道这是涉及到的-在我加入团队之前发生了。有一个有趣的项目试图简化此操作（https://github.com/davidosomething/vim-enhanced-resolver），但不幸的是，它似乎已损坏，因为它在尝试解析现有路径时会引发错误。

非常感谢您的帮助。

Answer 1

Google搜索没有结果，主要是因为我很茫然到底要搜索什么。

有关Vim帮助，请首先尝试Vim帮助本身。例如，哪个您正在使用命令吗？如果是gf，请检查gf的帮助看看它是如何工作的：

:h gf

[count]gf       Edit the file whose name is under or after the cursor.
                Mnemonic: "goto file".
                Uses the 'isfname' option to find out which characters
                are supposed to be in a file name.  Trailing
                punctuation characters ".,:;!" are ignored. Escaped
                spaces "\ " are reduced to a single space.
                Uses the 'path' option as a list of directory names to
                look for the file.  See the 'path' option for details
                about relative directories and wildcards.
                Uses the 'suffixesadd' option to check for file names
                with a suffix added.
                If the file can't be found, 'includeexpr' is used to
                modify the name and another attempt is done.

您还可以选中:h 'includeexpr'。例如这个会将初始的~扩展为resources/assets/js：

set inex=substitute(v:fname,'^\\~','resources/assets/js','')

Answer 2

在sidyll为我指明了正确的方向之后，经过相当多的修改和阅读帮助页面，我设法使它起作用。秘密在于递归substitute()调用，正则表达式捕获组和suffixesadd的组合：

set includeexpr=substitute(substitute(v:fname,'^\\~\/','resources/assets/js/',''),'^\\~sass/\\(.*\\)/\\(.*\\)$','resources/assets/sass/\\1/_\\2','')
set suffixesadd=.js,.vue,.scss

这很丑陋，但这是适合您的Vimscript。

使用Webpack波浪号别名时通过Vim中的'gf'解析JavaScript模块

2 个答案: