1

I want to go to a vue component file.

Vue component filenames are written in PascalCase: ExampleComponent.vue

In html (or in my case blade.php) the ExampleComponent.vue is instantiated by <example-component> (kebab-case). When my cursor is over <example-component> I get E447: Can't find file "container-gallery" in path

In the docs is written:

If the file can't be found, 'includeexpr' is used to
modify the name and another attempt is done.

So my Question is how do I use includeexpr in order to change from

example-component

to

resources/js/components/ExampleComponent.vue

Further research pointed me to the substitute function: :set includeexpr=substitute(v:fname, ..... )

but then I would need to preprocess the v:fname variable. A hint how to tackle that problem would be highly appreciated.

2
  • 2
    The problem gets simpler if path includes resources/js/components and suffixesadd includes .vue; then includeexpr only has to change example-component to ExampleComponent. This might be doable as a simple substitute; if not, you might be able to grab some code from tpope/abolish (the coercion mappings do similar transformations)
    – D. Ben Knoble
    Apr 6, 2021 at 14:01
  • @D.BenKnoble, I set the right path and the suffixesadd and it works for ExampleComponent. Now in order to transform kebab-case to PascalCase I used regex. echo substitute('kebab-case','\(\w\+\)\(\-\)\(\w\+\)','\u\1\u\3','') prints KebabCase. But setlocal includeexpr=substitute(v:fname,'\(\w\+\)\(\-\)\(\w\+\)','\u\1\u\3','') does not work. what am I missing?
    – Piet Pro
    Apr 7, 2021 at 10:35

1 Answer 1

0

I wrapped the substitute function in a own function:

function! B(name)
   return substitute(a:name,'\(\w\+\)\(\-\)\(\w\+\)','\u\1\u\3','')
endfunction`

~~/.vim/bundle/vim-blade/ftplugin/blade.vim --->this plugin overwrites my setlocal path so for a quick fix I added my changes to that plugin:

11 setlocal suffixesadd=.blade.php,.php,.vue
12 " setlocal includeexpr=substitute(v:fname,'\\.','/','g')
13 setlocal includeexpr=B(v:fname)
14 setlocal path+=resources/views;
15 setlocal path+=resources/js/components/;
16 setlocal path+=resources/js/components/gallery;

Instead of calling directly the substitution function I call my function B. I have no idea why I had to wrap substition in a custom function. It's not perfect, but now it changes from kebab-case to PascalCase and finds my vue-files. Suggestions for improvements are welcome.

1
  • Notes: use ~/.vim/after/ftplugin/blade.vim and you’re able to override all previous ftplugins where you want to. As for setting indentexpr, try your original and then run setlocal indentexpr?, I bet there’s an issue with escaping. One solution is to use let l:&indentexpr which assigns the option to a string; no escaping for set necessary.
    – D. Ben Knoble
    Apr 7, 2021 at 12:30

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.