Vetur: Auto-complete <template> tag

Created on 7 Aug 2017  路  11Comments  路  Source: vuejs/vetur

Info

  • Platform: Win/Linux
  • Vetur version: 0.9.3
  • VSCode version: 1.14.2

Problem

This problem has three parts:

  1. When you start typing the opening <template>, the suggestions for < are scaffold + others. If you select scaffold, you end up with <<template>... (double less-than character). The suggestions for <t are template with html + others. If you select that one, the same happens:
    1

  2. When you have a root or nested <template> with both opening and closing tags or just the opening tag, the autocomplete after the first element inside it will not be to close that element, but to scaffold the entire .vue file, or just the <template> depending on how much you wrote:
    2
    4

  3. Autocomplete for any nested <template> tags also tries to scaffold the entire .vue file or <template>:
    3

bug completion

Most helpful comment

Nope. Nested template is fixed.

Extra bracket requires more refactoring.

All 11 comments

Thanks for the report.

We will fix nested template issue. However, I cannot reproduce the second GIF. Can you provide more info?

@octref do you have any idea about repeated brackets?

@HerringtonDarkholme, what additional info would you need? In your case, does it actually suggest the closing tag </div>?

I cannot repro 2 or 3 either.

@HerringtonDarkholme I'm sure there is an option in CompletionItem that let's you configure that. I'll have time to look into it this weekend.

@octref I also have investigated the completion error.

The problem is we don't set textEdit properly in completionItem. When textEdit is absent, vscode will fallback to wordPattern option to compute completion start position.

Sadly, vscode cannot handle embedded langauge's wordPattern. https://github.com/vuejs/vetur/issues/369 is an example. $hyphenate-variable is a word in stylus, but vscode does not recognize. So completion is bad.

So we might need to provide textEdit for every completion item. But note, some client does not support textEdit, ike vim. A best solution is quite hard to find.

Only the extra bracket issue is addressed, correct?

Nope. Nested template is fixed.

Extra bracket requires more refactoring.

Great! I will test whenever you make the next release. Thanks.

I can repro this problem when nested template,it always generate something like

<<template>

</template>

vscode version 1.19.1,should I open a new issues? or it's just some setting problem?

We haven't released a new version, please wait patiently.

+1 VSCode auto completes/auto closes my markup in react, not my markup in .vue files though. using vetur v0.13.0

Was this page helpful?
0 / 5 - 0 ratings