前端项目搭建与调试

一.VsCode安装与使用
1.1下载VsCode
VS Code的当前版本为1.61，支持Windows，Ubuntu，Mac
https://code.visualstudio.com/Download

1.2 安装
VS Code的安装比较简单，一直下一步即可。安装完成后打开，界面如下：

1.3 Vscode的简单介绍
搜索，如果资源管理器文件过多，可通过输入内容查询
1.4 扩展，搜索内容后安装需要的插件，长使用的插件为

配置类插件
Beautity:格式化代码工具，美化JavaScript，json，css，sass和HTML在Visual Studio代码

Atuo Rename Tag
修改html标签，自动帮你完成头部和尾部闭合标签的同步修改
Code Spell Checker
代码拼写检查器
一个与camelCase代码配合良好的基本拼写检查程序。
此拼写检查程序的目标是帮助捕获常见的拼写错误，同时保持误报数量较低。

guides
显示代码对齐辅助线，很好用

Path Intellisense
可自动填充文件名。

代码提示提示类
（1）.HTML Snippets
完整的HTML代码提示，包括HTML5

（2）.HTML CSS Support
在 html 标签上写class 智能提示css样式

（3）.jQuery Code Snippets
jQuery代码提示
超过130个用于JavaScript代码的jQuery代码片段。
只需键入字母’jq’即可获得所有可用jQuery代码片段的列表。

（4）.HTMLHint
html代码检测，支持html5

语言相关
VUE插件
Vetur 语法高亮、智能感知Emmet等
VueHelper snippet代码片段
ESLint 将ESLintJavaScript集成到VS代码中。
Prettie 代码规范性插件
1.5 快捷键
查找替换
查找: Ctrl+F
查找替换: Ctrl+H
ctrl+^\ `：打开终端调试，依次打开查看-》集成终端，打开终端调试窗口，或者快捷键
编辑器与窗口管理
新建文件: Ctrl+N
文件之间切换: Ctrl+Tab
打开一个新的VS Code编辑器: Ctrl+Shift+N
切出一个新的编辑器窗口（最多3个): Ctrl+
切换左中右3个编辑器窗口的快捷键: Ctrl+1 Ctrl+2 Ctrl+3

代码编辑-格式调整

代码行向左或向右缩进: Ctrl+[ 、 Ctrl+]
复制或剪切当前行/当前选中内容: Ctrl+C 、 Ctrl+V
代码格式化: Shift+Alt+F
向上或向下移动一行: Alt+Up 或 Alt+Down
向上或向下复制一行: Shift+Alt+Up 或 Shift+Alt+Down
在当前行下方插入一行: Ctrl+Enter
在当前行上方插入一行: Ctrl+Shift+Enter