vscode vue添加用户代码补全

在Visual Studio Code (VSCode) 中，Vue.js 的代码补全功能主要是通过配置 TypeScript 或 JavaScript 插件来启用的。Vue本身并没有内置的代码补全功能，但它可以很好地与TypeScript结合使用，因为TypeScript提供了强大的类型系统和自动完成支持。

以下是设置 Vue.js 代码补全的步骤：

1. 安装必要的插件：
- **vetur**：这是官方推荐的 VSCode Vue 配套插件，用于提供语法高亮、类型检查和智能提示。你可以通过VSCode的扩展市场搜索"vetur"安装。
- **ts-node** 和 **typescript**：如果要在项目中使用TypeScript，这两个插件是必需的。

npm install -D typescript ts-loader @vue/cli-plugin-typescript

或者使用yarn：

yarn add -D typescript ts-loader @vue/cli-plugin-typescript

2. 配置VSCode：
- 打开你的`settings.json`文件（`File > Preferences > Settings`），或者直接创建它，然后添加以下内容：

     {
       "editor.formatOnSave": true,
       "vetur.format.defaultFormatter.js": "vscode-typescript",
       "vetur.format.defaultFormatter.ts": "prettier-vscode",
       "vetur.experimental.templateInterpolationService": true,
       "[vue]": {
         "editor.defaultFormatter": "octref.vetur"
       }
     }

- 这里设置了vetur作为默认的JavaScript和TypeScript格式化器，并启用了模板字符串插值服务。

3. 重启VSCode，现在你应该可以在编写Vue组件时享受到代码补全了。当你输入标签如`<template>`、`<script>`、`<style>`等，或者在Vue相关的属性上键入，VSCode会基于Vue的语法和你引入的TypeScript类型为你提供自动完成选项。