VS Code 常用设置和使用技巧

VS Code零基础教程

一、注意点

• VS Code不能新建文件夹
• VS Code不保存文件没有语法高亮
• 命令面板：Ctrl+Shift+P，可以访问所有命令
• 自定义的设置会以json的形式保存在这里
  
• 插件市场筛选功能
  

二、常用设置

• 切换语言：Ctrl+Shift+P>搜索display>选择语言

• 切换主题：Ctrl+KT

• 设置退出时提示保存：设置>搜索hot exit>选为off
  

• 单击文件预览但不打开：设置>搜索preview>勾选

• 给光标移动添加过渡动画：设置>文本编辑器>光标>勾选
  

• 文件末尾添加空行：设置>搜索newline
  

三、净化窗口，专注代码

1. 禅模式：查看>外观>禅模式
2. 隐藏侧边栏：Ctrl+B
3. 关闭代码缩略图：设置>搜索minimap>取消勾选
   
4. 设置启动后打开空文件：设置>搜索restore>选择none
5. 设置启动后打开空页面：设置>搜索startup>选择none为一个空页面
   

四、使用技巧

up主讲的很好，视频观看更直观（全是干货懒得记笔记了！）

• 交互式演练场（多光标等操作，很有用！）
• 前端开发效率利器Emmet 的使用和配置（HTML神器）
• 代码片段
  1. 自定义代码片段
  2. 自动生成代码片段网址
  3. 下载插件使用封装好的代码片段：添加筛选条件
     
• 多光标功能，可以从5分钟后开始看
• 鼠标操作技巧

五、插件介绍

• Live Server
  保存HTML代码网页实时刷新
  注意点：必须要有head标签和body标签、HTML文件一定要放在文件夹中
  使用方法：然后点击VS Code右下角GoLive
  常用设置
  位置：设置>扩展>Live Server Config
  选择打开的浏览器：默认为系统默认浏览器
  
  改都后整体刷新网页：默认只刷新改动的
  
  设置访问ip：设置为电脑的ip，在局域网中可设备可以访问
  
  修改端口号
  
  添加文件到这里改动这些文件不改动网页：