快速开始，使用 VSCode 开发 Vue 项目如何配置语法高亮和自动格式化

关于 IDE

开发 Vue 项目，一般使用 VSCode/WebStorm/Atom 等 IDE，推荐使用 VSCode。

而 VSCode 原生不支持 Vue 语法高亮和自动格式化等功能，需要通过插件来支持。

安装插件

点击 首选项 -> 扩展，安装以下插件：

• Vetur – vue 必备插件，用于语法高亮和代码提示
• Auto Close Tag – 自动完成标签，如输入 时，自动添加
• Auto Rename Tag – 重命名开始或结束标签时，自动将配对的开始或结束标签进行重命名
• JavaScript Snippet Pack – 一些常用的模板代码快捷键，如 cl 回车，生成 console.log();
• npm – npm 相关
• Path Intellisense – 路径提示
• Markdown All in One – 方便打开 Markdown 文档

添加配置

打开首选项 -> 设置 -> 右上角的 {} 符号打开 settings.json -> 将下面的 json 配置粘进去 -> 保存

 "emmet.syntaxProfiles"