Microsoft Visual Studio Code安装

Microsoft Visual Studio Code(以下简称VS Code)是比较强大的前端通用编辑器,提供了很多插件帮助前端编程。
1、前往官网下载稳定安装包:
vue安装及环境搭建二2、双击运行安装程序,默认安装路径在C盘,建议修改为其他驱动器的路径中,完成安装。

VS Code常用插件

选择编辑器左侧【Extensions】菜单:
vue安装及环境搭建二

一、汉化插件

Chinese(Simplified) Language Pack for Visual Studio Code
中文(简体)语言包:为VS Code提供本地化界面
vue安装及环境搭建二

二、智能提示插件

HTML Snippets

智能提示html标签
vue安装及环境搭建二

HTML CSS Support

智能提示css类名及id
vue安装及环境搭建二

JavaScript(ES6) code snippets

ES6语法智能提示
vue安装及环境搭建二

jQuery Code Snippets

jQuery代码智能提示
vue安装及环境搭建二

Class autocomplete for HTML

智能提示html的class属性
vue安装及环境搭建二

IntelliSense for CSS class names

智能提示css的class类名
vue安装及环境搭建二

三、自动帮助插件

Auto Close Tag

自动闭合HTML/XML标签
vue安装及环境搭建二

Auto Rename Tag

自动完成另一侧标签的同步修改
vue安装及环境搭建二

Path Intellisense

自动提示路径
vue安装及环境搭建二

四、显示优化

Beautify

格式化html,css,js
vue安装及环境搭建二

Bracket Pair Colorizer

给括号不同的颜色,便于区分不同区块
vue安装及环境搭建二

guides

代码对齐辅助线
vue安装及环境搭建二

vscode-icons

文件系统的目录树图标
vue安装及环境搭建二

filesize

显示当前文件大小及文件具体详细信息
vue安装及环境搭建二

五、规范编程及调试辅助

vscode-fileheader

作者个人信息注释,自动保存最后代码书写时间
vue安装及环境搭建二

Document This

JS代码规范注释
vue安装及环境搭建二

Code Spell Checker

代码拼写检查
vue安装及环境搭建二

HTMLHint

静态检查规则
vue安装及环境搭建二

open in browser

支持右键在浏览器中打开html文件
vue安装及环境搭建二

Debugger for Chrome

支持断点映射在chrome中
vue安装及环境搭建二

六、框架及其他

Vetur

Vue多功能集成插件
vue安装及环境搭建二

Npm Intellisense

import 语句中自动填充 npm 模块,require包时自动提示npm安装包
vue安装及环境搭建二完成安装后需重启一下VS Code则会生效。

相关文章: