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">
 
 

 
 

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

  1. Fluent Nhibernate code frist简单配置

    Fluent Nhibernate code frist简单配置   前言 在以前的项目开发过程中使用nhibernate做完orm映射工具需要编写大量的xml映射文件,项目过程中往往会因为一个字段等 ...

  2. 第二节:创建模型,使用Code First,配置映射关系

    这一节,实现模型的创建,配置映射关系 使用Code First数据迁移. 创建模型 一,首先创建几个接口:实体接口,聚合根接口,值对象接口 1,实体接口: 2,聚合根接口: 3,值对象接口: 二,模型 ...

  3. Code Blocks中配置OpenGL方法

    关于在Code Blocks中配置OpenGL的方法,在网上一直没有找到实用的方法,后来在马龙师兄的帮助下终于配置成功了,现把配置过程记录如下. (1)下载codeblocks,最好是带mingw的版 ...

  4. Code First 关系配置整理

    之前EF一直有性能问题以及使用便利性问题, 终于到了EF6有了Migrations之后, 小弟也决定加入EF阵营了. 在学习FluentAPI配置关系的时候, 发现网上的好几个教程实际上博主自己都没有 ...

  5. Code First03---CodeFirst根据配置同步到数据库的三种方式

    上一节我们说到使用Fluent API对实体的配置,但是有一个问题了,在业务中我们可以用到的实体很多,那是不是每个都需要这样去配置,这样就造成我们重写的OnModelCreating方法很庞大了.所以 ...

  6. Code::Blocks项目配置基础

    File 菜单 New :新建( Empty file/file . class . project . build target ) . Recent projects/files :近期打开的项目 ...

  7. visual studio code 调试nodejs 配置简单HTTP服务器

    介绍 Visual Studio Code是一个轻量级的Web集成开发环境on Linux,Mac and Windows,特别是作为前端人员来了, 多了一个可供选择的生产力工具IDE,调试js代码简 ...

  8. 高效开发者是如何个性化VS Code插件与配置的?

    2年之前,我放弃了Sublime Text,选择了Visual Studio Code作为代码编辑器. 我每天花在VS Code上的时间长达5~6个小时,因此按照我的需求优化VS Code配置十分必要 ...

  9. 【译】第8节---EF Code First中配置类

    原文:http://www.entityframeworktutorial.net/code-first/configure-classes-in-code-first.aspx 前面的章节中我们知道 ...

随机推荐

  1. vs打开项目出错:未找到导入的项目“C:\Program Files (x86)\MSBuild\Microsoft.Cpp\v4.0\BuildCustomizations\CUDA 5.0.props”的解决办法

    有时候由于CUDA升级或者下载的源码原创建项目的CUDA版本与自己的不同,在打开项目的时候发现加载不上,提示:未找到导入的项目“C:\Program Files (x86)\MSBuild\Micro ...

  2. C++11右值引用和std::move语句实例解析

    关键字:C++11,右值引用,rvalue,std::move,VS 2015 OS:Windows 10 右值引用(及其支持的Move语意和完美转发)是C++0x将要加入的最重大语言特性之一.从实践 ...

  3. UIImageView帧动画相关属性和方法

    @property(nonatomic,copy) NSArray *animationImages; 需要播放的序列帧图片数组(里面都是UIImage对象,会按顺序显示里面的图片) @propert ...

  4. Spring的IoC容器

    Spring是一个轻量级的Java开发框架,其提供的两大基础功能为IoC和AOP,其中IoC为依赖反转(Inversion of Control).IOC容器的基本理念就是"为别人服务&qu ...

  5. TypeScript入门-基本数据类型

    ▓▓▓▓▓▓ 大致介绍 TypeScript是由C#语言之父Anders Hejlsberg主导开发的一门编程语言,TypeScript本质上是向JavaScript语言添加了可选的静态类型和基于类的 ...

  6. Kubernetes使用cephfs作为后端存储

    这里使用了k8s自身的持久化卷存储机制:PV和PVC.各组件之间的关系参考下图: PV的Access Mode(访问模式) The access modes are: ReadWriteOnce – ...

  7. oracle删除字段中的空格、回车及指定字符

    create or replace procedure PROC_test is --Description:删除字段中的指定字符(回车chr(13).换行chr(10)) --By LiChao - ...

  8. JAVA-实例方法被覆盖,静态方法被隐藏Explain

    被覆盖比较好理解,类似于多态的实现. 被隐藏是指静态方法的访问是根据当前对象的表面类型来决定的,比如 Supers = new Sub(); s.greeting()访问的是Super的静态方法,如果 ...

  9. 老李分享:loadrunne动态查询db2数据库

    老李分享:loadrunne动态查询db2数据库   poptest老李认为性能测试脚本开发不仅仅涉及到脚本开发的技术层面,同时也要对一些其他技术有所了解动态链接库的技术,线程安全等等,建议在做下面的 ...

  10. 老李推荐:第4章1节《MonkeyRunner源码剖析》ADB协议及服务: ADB协议概览 1

    老李推荐:第4章1节<MonkeyRunner源码剖析>ADB协议及服务: ADB协议概览   poptest是国内唯一一家培养测试开发工程师的培训机构,以学员能胜任自动化测试,性能测试, ...