vs code官方下载地址 : https://code.visualstudio.com/Download
 
下载好的vs code相当是一款纯文本编辑器，接下来开始进行对其配置：
 
  1. 页面设置（vscode通过添加指令的方式进行属性设置）：

　　在用户配置文件中配置，可以通过控制台熟读setting快速打开（MAC用户通过command+，快速呼出配置界面）

　　files.autoSave ：个人配置：

 
 
  1. vscode提供了丰富的插件库（个人所用到得插件）：

　　View In Browser

    • 预览页面（ctrl+F1）MAC (command+F1)

　　vscode-icons

  • 侧栏的图标，对于一个有视觉强迫症的人是必须要的
  • 安装好后的配置：
  • HTML Snippets
    • 支持HTML5的标签提示

　　  HTML CSS support

    • css自动补齐

　　  JS-CSS-HTML Formatter

    • 格式化代码（ctrl+alt+f）

　　  jQuery Code Snippets

    • jquery 自动提示

　　  Path Autocomplete

  • 路径自动补齐（在有输入‘ / ’号的情况下提示路劲补全）

　　　ESLint

    • 检测JS语法是否错误必备
　　   Vue 2 Snippets
  • vue必备，提供vue.js2.0的语法库

　　   Debugger for Chrome

  • 通过谷歌浏览器进行断点调试，方便调试
 
  1. 常用快捷键：
ctrl+b 切换侧边栏
ctrl+\ 拆分编辑器
ctrl+鼠标滚轮 缩放编辑器的字体
alt+shift+f 整理代码格式
alt+z 切换自动换行
ctrl+· 打开终端调试
ctrl+shift+n 新建窗口
ctrl+p 文件内搜索(聚焦在某个文件)
ctrl+shif+f 全编辑器搜索(聚焦在资源管理器)
单击文件 预览(再点别的会替换成其他)
双击文件 编辑文件(固定在工作区)
 
  1. 工作区间设置
          设置文件位置(中文版)：文件->首选项->工作区设置->setting.json
          设置文件位置(中文版)：File > Preferences->setting.json
     
控制在多少个字符后编辑器会自动换到下一行。将其设置为 0 则将打开视区宽度换行(自动换行)。将其设置为 -1 则将强制编辑器始终不换行。"editor.wrappingColumn": 0
 
控制行号的可见性 "editor.lineNumbers": true
控制编辑器是否应呈现缩进参考线"editor.renderIndentGuides": true
 
控制是否自动保存更新后的文件。接受的值:“off”、“afterDelay”、“onFocusChange”(编辑器失去焦点)、“onWindowChange”(窗口失去焦点)。如果设置为“afterDelay”，则可在 "files.autoSaveDelay" 中配置延迟。"files.autoSave": "off"
 
控制资源管理器是否应该允许通过拖放移动文件和文件夹,(默认就是true，不需要专门修改)。"explorer.enableDragAndDrop": true
 
缩进 head 和 body 部分(默认false)。"html.format.indentInnerHtml": false
 
  1. 开始工作
     新建一个html文档，会发现没有模版代码，这个时候我们在第一行输入！，点击tab键，就会生成：
 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
   
</body>
</html>
 
把其中的两段代码去掉。
<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
 
 
 
 

关于vscode的个人配置的更多相关文章

  1. vscode编辑器自定义配置

    { //删除文件确认 "explorer.confirmDelete": false, // 主题 "workbench.iconTheme": "v ...

  2. 前端之旅一：vscode调试web配置

    vscode调试web配置 第一步:安装vscode,并启动(vscode的安装包自行到其官网上下载) 第二步:在vscode上安装chrome插件 第三步:配置,启动调试 配置信息 { // Use ...

  3. vscode 安装与配置

    vscode 安装与配置 安装 安装 vscode 从官网 [https://code.visualstudio.com/Download] 下载速度奇慢,可以找到下载的网址,如下图所示,将其中红色框 ...

  4. Vue学习笔记-VSCode安装与配置

    一  使用环境: windows 7 64位操作系统 二  VSCode安装与配置  1.下载: https://code.visualstudio.com 直接点击即可. 2. 点击按装程序,默认安 ...

  5. VSCode·备份&还原配置及拓展项

    阅文时长 | 0.54分钟 字数统计 | 924字符 主要内容 | 1.引言&背景 2.备份VSCode配置 3.还原VSCode配置 4.Syncing常用命令 5.声明与参考资料 『VSC ...

  6. 使用 VSCode 给STM32配置一个串口 printf 工程

    使用 VSCode 给STM32配置一个串口 printf 工程 gcc 重定向 printf 和 keil 不一样. 文件准备 先从以前的工程中拷过一份串口的代码来,然后在 main 函数中初始化串 ...

  7. VSCode官方的配置同步方案

    前言 这几天在迁移电脑工作环境,对于VSCode,我实在不想从头做下载插件.配置代码规则这样的事情,于是求助百度,搜索结果靠前的解决方案基本都是使用Setings Sync插件,于是我就从了. 经过好 ...

  8. LibOpenCM3(四) VSCode IDE 环境配置

    目录 LibOpenCM3(一) Linux下命令行开发环境配置 LibOpenCM3(二) 项目模板 Makefile分析 LibOpenCM3(三) .ld文件(连接器脚本)和startup代码说 ...

  9. VScode插件以及配置

    Auto Rename Tag —— 自动同步修改标签 AutoFileName —— 自动补全路径提示 background —— 一个萌萌的插件,可以自己设置vsc的背景图 Bootstrap 3 ...

  10. Vscode的python配置（macOS）

    _ 1. Vscode是一款开源的跨平台编辑器.默认情况下,vscode使用的语言为英文(en),以下步骤改为中文 打开vscode工具,使用快捷键组合[Cmd+Shift+p],在搜索框中输入“co ...

随机推荐

  1. jmeter对请求参数的签名处理

    1.首先在本地写好签名的算法,本文采用RSA签名. public final class Base64 { static private final int BASELENGTH = 128; sta ...

  2. webpack实践总结

    一.Loader写法及执行顺序 从webpack2起,loader的格式如下: module: { rules: [ {test: /\.css$/, use: ['style-loader','cs ...

  3. Linux-Shell脚本编程-学习-3-Shell编程-shell脚本基本格式

    前面两篇文章基本介绍了一部分linux下的基本命令,后面还需要大家自行了解下linux的文件系统的磁盘管理部分,这里就不在写了. 什么是shell编程,我也解释不来,什么是shell脚本了,我理解就是 ...

  4. wirehshark解密IPSEC流量

    wireshark解密IPSEC加密过的流量 题目是安恒二月月赛题目:简单的流量分析 1.首先会发现很多esp类型的流量 我们不知道密钥就没有办法解密,猜测密钥肯定是在流量包里面的. 加密流量在786 ...

  5. Flask Web开发从入门到放弃(一)

    第1章 章节一 01 内容概要 02 内容回顾 03 路飞学城之加入购物车 04 路飞学城之结算 05 路飞学城之立即支付 06 路飞学城之后续计划 07 Flask框架简介和快速使用 08 FLas ...

  6. golang模拟新浪微博登录

    1.基于幽灵蛛pholcus开源项目的规则 直接贴代码,代码可以更改后用于其他爬虫项目 package pholcus_lib // 基础包 import ( // "github.com/ ...

  7. 怎么用Q-Q图验证数据集的分布

    样本数据集在构建机器学习模型的过程中具有重要的作用,样本数据集包括训练集.验证集.测试集,其中训练集和验证集的作用是对学习模型进行参数择优,测试集是测试该模型的泛化能力. 正负样本数据集符合独立同分布 ...

  8. Kindle 3（非常旧的版本） 隔一段时间自动重启问题

    买了本新书后,kindle 3 自己没事就在那边重启,几分钟一次 查到解决方案1: https://answers.yahoo.com/question/index?qid=2014040815565 ...

  9. 个人作业4——alpha阶段个人总结(201521123103 吴雅娟)

    一.个人总结 在alpha 结束之后, 每位同学写一篇个人博客, 总结自己的alpha 过程: 请用自我评价表:http://www.cnblogs.com/xinz/p/3852177.html 有 ...

  10. [Elasticsearch] 多字段搜索 (六) - 自定义_all字段，跨域查询及精确值字段

    自定义_all字段 在元数据:_all字段中,我们解释了特殊的_all字段会将其它所有字段中的值作为一个大字符串进行索引.尽管将所有字段的值作为一个字段进行索引并不是非常灵活.如果有一个自定义的_al ...