vscode配置html_VScode,最适合前端开发的环境

  • Post author:
  • Post category:其他

日常安利

在前端开发中,有一个非常好用的工具,Visual Studio Code,简称VS code。

都不用我安利VS code,大家就会乖乖的去用,就算你不用,我也要强势安利

我是来给大家安利插件的,想做个比较全面的插件集合给大家。我结合最近的情况,总结一下,也单独写介绍适合Python新手学习的插件,让你事半功倍。

比心❤。

强大特点

VS vode特点:

  1. 开源,免费
  2. 自定义配置
  3. 集成git
  4. 智能提示强大
  5. 支持各种文件格式(html/jade/css/less/sass/xml/py/c/c++/vbs)
  6. 调试功能强大
  7. 各种方便的快捷键
  8. 强大的插件扩展
  9. 丝滑如某芙,顺畅

安装插件

0aa3aebf570de563ca0782ed714791f6.png

在鼠标停止的地方就是插件页面,可以在这里选择和搜索插件,这种方法较为简单,当然也有其他方法

命令行

按F1或Ctrl+Shift+p,输入extensions,点击第一个就可以

5ccd9ccfba103c4128d466c5282f8519.png

点击即可

ctrl + P 然后输入 >ext install

de0c937c63116e7d67acdee89bc0244f.png

好用的插件

1.Settings Sync

48f1e43a214824e2124eb8a24beea52e.png

最好用的插件,没有之一,一台电脑配置好之后,其它的几台电脑都不用配置。新机器登录一下就搞定了。再也不用折腾环境了。

使用GitHub Gist同步多台计算机上的设置,代码段,主题,文件图标,启动,键绑定,工作区和扩展。

2.Debugger for Chrome

c46bb7ec4031d3a5281cc99627ab50ba.png

3.beautify

格式化代码工具

美化javascript,JSON,CSS,Sass,和HTML在Visual Studio代码。

6d59f5c14703865c5a2ea5817e5b2521.png

4.vscode-icons

更改显示Visual Studio代码的图标,目前该插件已被vscode内部支持:”文件” -> “首选项” -> “文件图标主题”

b1ae4f7b82aeec0c76d02e34b7d5f5af.png

5.Atuo Rename Tag

修改 html 标签,自动帮你完成头部和尾部闭合标签的同步修改。

8de4f2bc8b34c6f6fbc81151d08d7aec.png

6.Path Intellisense

自动填充文件名。不用手动码文件名了(哭晕在厕所)

711161b2c5575bed1b2753f7dc58e0bf.png

主题推荐

一个非常适合夜猫子的 VS Code 主题。像是为喜欢深夜编码的人精心设计的。

1.Night Owl

f29eb0e758df38553590a37d6ee5709b.png

2.Atom One Dark Theme

4d3f9f45b4c1a4fa6aef839ba816c0e2.png

Python插件

OK,进入正题,现在来推荐一下VScod中的Python插件,插件安装好的话,会为你的学习带来不少的帮助哦

中文语言包

Chinese (Simplified) Language Pack for Visual Studio Code

3af4d6cfc48ad0b1bf86387e12986cad.png

这样子在使用vscod的时候就不会因为英语不好而导致出问题啦,非常适合新手

Python支持

打开扩展搜索Python,可以直接下载啦,记得下载第一个微软官方的哦。

531314201aeceb210f615d6310957c86.png

代码自动补齐和提示

Visual Studio IntelliCode

7f1cbc5875ea772b1fd84c64e5309c9c.png

括号颜色提示

Bracket Pair Colorizer

c32e85a4305f60c2377e4db5d613c24e.png

每一对括号都有自己的颜色(单身狗的生气)

结尾

插件的介绍就到这里,各位初学者不能过渡依赖插件哦,要认真学习哦。

如果有其他大佬安利插件,欢迎在下方评论区留言哦。

本文作者:Whitezero,未经授权,禁止转载