vscode 插件

通用

序号 名称 描述
1 chinese(simplified ...) 简体中文语言包
2 live server html 实时预览
3 prettier-code formatter 最流行的代码格式化插件
4 better comments 自定义注释颜色
5 path intellisense 路径自动感知填充
6 helium icon theme 一款我喜欢的文件图标主题
7 one dark pro 经典的主题,使用者众多,很耐看
8 material theme 经典”材料”主题
9 material theme icons 常与material theme配置的文件图标
10 shades of purple 赛博朋克风格的一款主题,很明亮风骚
11 dracula official 经典的吸血鬼主题
12 dracula at night 个人更喜欢这款小众的吸血鬼暗黑版(教学用它)
13 code runner 几乎可以快速运行常见的所有语言,如php,java,js...
14 codesnap 快速生成苹果电脑风格的代码片断截图,分享时使用

markdown

序号 名称 描述
1 markdown preview... markdown 实时预览
2 markdownlint markdown 语法检查器

html / css

序号 名称 描述
1 auto close tag 标签自动关闭
2 auto rename tag 标签自动更名
3 indent-rainbow 以不同颜色显示代码缩进
4 css peek 查看并跳转到 css 定义位置
5 html css support css 自动智能补齐
6 intellsense for css ... html 中的 css 智能提示
7 easy less less 实时编译
8 px-to-viewport px 自动转 vw
9 svg preview svg 预览器
10 tailwind css ... 无需离开 html 就可快速构建出现代网页
11 tabout 按 tab 就可快速跳到下一下,或跳出/越过括号等

js / es6 / node / vue

序号 名称 描述
1 bracket pair ... 括号高亮配对提示
2 javascript(es6) code snippets 常用 js 代码片断
3 node-snippets 常用 node 代码片断
4 quokka.js js/es6 代码语法实时检查/执行器(续命法宝)
5 rest client 可不离开 vscode 环境进行 api 请求测试
6 eslint js 代码质量智能分析器
7 vetur vue 语法高亮,智能感知,emmet 等
8 vue3 snippets vue3 常用代码片断
9 vue-helper: vue-helper 在扩展中使用的 vue 提示,如 element ui

php

序号 名称 描述
1 php intelephense php 语法提示/自动补齐
2 php intellisense php 代码跟踪/重构/自动完成
3 php debug php 代码调试器
4 php docbloker php 生成块级注释
5 vscode-database vscode 数据库 SQL 支持插件

编程字体

为什么必须用等宽字体?
从视觉上快速区分,0 和 o, 1 和 l, 等宽字体可以做到,全部字符采用相同宽度,可有效解决它

字体名称 描述 支持连写
Fira Code 喜欢的真喜欢,讨厌的真讨厌 支持
JetBrains Mono JetBrains 出品,免费 支持

字体安装成功后,还需要在 vscode 中进行配置: settings.json

# 将Fira Code 字体放在第一个
"editor.fontFamily": "'Fira Code',Consoles, 'Courier New', monospace",

# 打开允许连写开关
“editor.fontLigatures”: true,

声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。