32

VS Code 1.32: Autocomplete in Vue Templates

 5 years ago
source link: https://www.tuicool.com/articles/hit/Av6veqf
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

The VS Code 1.32 February update is out now and with it comes some great new features for Vue users.

Table of Contents

  • Vue Templates Autocomplete
  • What else does can I do?

Let's run through the list of features that are in the new 1.32 update:

  • Color themes without reloading : Install and apply new theme extensions without reloading.
  • Keyboard shortcuts editor improvements : Modify keybinding 'when' conditions in the editor.
  • Problems panel hover commands : Apply Quick Fixes or open a Peek window directly from hovers.
  • Preferred Code Actions : Preferred (mostly likely) Code Actions support auto fixing common issues.
  • Debug Console customization : Modify font size, font family, and line height of the Debug Console.

Big list of updates as usual! This is why VS Code has consistently been used by so many developers.

Vue Templates Autocomplete

Every month of VS Code updates brings in some useful features but there's one this month that really stood out to me.

The ability to have VS Code (through the Vetur Vue Plugin ) provide Intellisense and Autocomplete. Here's the example that the VS Code update logs give us:

riAFZbR.gif

Let's say you have some data() in your Vue component. Let's say a message variable.

677rm2j.png!web

If you wanted to use that message variable in your template, you can start typing and see VS Code help you out!

rInqEvF.png!web

What else does can I do?

This will work for the following:

  • data in the current component
  • computed properties
  • methods
  • props for any child components: will show on v-bind

The other updates that came in are:

<template>

The full list of updates can be found on the Vetur changelog .

A big update for Vue developers that use VS Code and Vetur. Will definitely speed up my own Vue work. Great work to the VS Code team as always!


Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK