VSCode 的安装与配置

转载:https://www.jianshu.com/p/18f5c2ab578e

安装

官网下载安装包

安装时把以下选项选中:

使用

找个地方新建一个目录(目录名不要中文),假设目录名为 vs-demo

右键点击该目录,open with code

使用Ctrl+Shift+E打开资源管理器,在 vs-demo 目录里新建 HTML 文件,文件名为 index.html

在 index.html 依次输入:英文感叹号、回车 键,即可看到一个完整的 HTML 页面

由于 vscode 时常更新,如果回车键不行,就试试Tab键

这种快捷写法叫做 Emmet,目前所有的前端编辑器都支持 Emmet。

关于 Emmet 的更多快捷写法,见:

官网的视频介绍

Emmet 作弊表

配置

VSCode 的配置方式就写编辑一个配置文件,打开「文件 - 首选项 - 设置」,对应快捷键为Ctrl + ,

左侧为系统默认配置项,右侧为你要覆盖的配置项。把你要修改的项从左边拷贝到右边,然后保存,即可生效。

设置字体与字号

在右侧文件中添加一行(注意末尾要有英文逗号)

"editor.fontSize": 18,

保存,字号就变大了。

设置字体也是类似,添加

"editor.fontFamily": "Consolas, 'Courier New', monospace",

即可将字体设置为你想要的。这里推荐「10大最适合编程的字体推荐下载」,够你玩一上午了。我用的编程字体一般是Source Code Pro和M Plus这两款。

其实 VSCode 默认的配置就挺好的。

插件安装

VSCode 自带 Emmet、Git 继承和 JS 调试功能,已经十分完善了,但是还是有一些特殊的需求,这个时候我们就可以安装第三方插件了。由于第三方插件不是微软生产的,所以质量良莠不齐,请注意甄别。

安装 open in browser

按Ctrl + Shift + X打开扩展面板,然后输入open in browser,点击第一个结果的「安装」按钮,稍等片刻就安装好了(相比之下 Sublime 的插件安装体验就差很多)。

然后你在任意 HTML 文件右键,就可以看到Open In Default Browser这个按钮了,点就试试看。

Git 操作

要在 VSCode 里面操作 Git,前提是你已经配置好了 Git,如果你没有配置过,那么就在 Git Bash 里输入以下命令:

git config--globaluser.name 你的英文名git config--globaluser.email 你的邮箱git config--globalpush.defaultmatching git config--globalcore.quotepathfalsegit config--globalcore.editor"vim"

然后你就愉快地使用 VSCode 的 Git 功能了。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 安装 从官网下载安装包 安装时把以下选项选中: 使用 找个地方新建一个目录(目录名不要中文),假设目录名为 vs-...
    鹧鸪少阅读 32,395评论 0 6
  • 一直以来,大家对开发的代码编辑器都没有一个最好的选择,而vscode是我发现速度相对快,对于新版的html css...
    云翼飞阅读 11,104评论 0 2
  • VSCode 安装1.从官网下载安装包安装时把以下选项选中:image.png 使用1.找个地方新建一个目录(目录...
    浮云都想对你说阅读 500评论 0 1
  • 1.一份工作代表现在的水平深浅,持续耕耘
    道马阅读 222评论 0 0
  • 感情里的等待,总是一种漫长而曲折的过程。 敏敏是个活泼好玩的女生,阿俊则文艺安静。朋友们都知道,阿俊一直默默的喜欢...
    小朋友嘿哈阅读 153评论 0 1