今天突然想着写一下博客进行赋能,哈哈哈~这是我自己使用 VSCode 的插件集合~~
插件一: Chinese (Simplified) (简体中文)
VSCode 汉化插件提升了日常的开发效率
插件二: Auto-Close-Tag 自动关闭标签
大大提升了开发效率,从 VS Code 1.16 开始,它内置了对 HTML、Handlebars 和 Razor 文件的关闭标记支持。此扩展支持其他语言,如 XML、PHP、Vue、JavaScript、TypeScript、JSX、TSX 等。它是可配置的。
用于auto-close-tag.enableAutoCloseTag设置是否自动插入关闭标签(true默认为):
{
"auto-close-tag.enableAutoCloseTag": true
}
设置是否自动关闭自闭标签(例如 type <br,然后 type /,>将自动添加)(true默认为):
{
"auto-close-tag.enableAutoCloseSelfClosingTag": true
}
是否在自闭合标签的正斜杠前插入空格(false默认为):
{
"auto-close-tag.insertSpaceBeforeSelfClosingTag": false
}
添加条目auto-close-tag.activationOnLanguage以设置将激活扩展程序的语言。用于["*"]激活所有语言。以下是默认设置:
{
"auto-close-tag.activationOnLanguage": [
"xml",
"php",
"blade",
"ejs",
"jinja",
"javascript",
"javascriptreact",
"typescript",
"typescriptreact",
"plaintext",
"markdown",
"vue",
"liquid",
"erb",
"lang-cfml",
"cfml",
"HTML (Eex)"
]
}
插件三: Auto Rename Tag 自动重命名标签
配置
添加条目auto-rename-tag.activationOnLanguage以设置将激活扩展程序的语言。默认情况下,它将["*"]为所有语言激活。
{
"auto-rename-tag.activationOnLanguage": ["html", "xml", "php", "javascript"]
}
该设置应使用VS Code中定义的语言 ID 进行设置。以javascript 定义为例,我们需要使用javascriptfor.js和.es6,使用javascriptreactfor .jsx。所以,如果你想在.js文件上启用这个扩展,你需要javascript在 settings.json 中添加。
插件四: open in browser 在浏览器中打开
快捷方式
| 组合键 | 指令 |
|---|---|
Alt + B | 在默认浏览器中打开 |
Shift + Alt + B | 在指定浏览器中打开 |
插件五: Postcode 可用于创建和测试简单和复杂的 HTTP/s 请求
打开方式,在VSCode左侧面板点击即可如下图:
插件六: TODO Highlight 注释高亮
具体配置根据自己喜欢的款式自由设定;附上插件官方文档地址:TODO Highlight
插件七: Image preview 图片预览 项目中引入的图片可以直接预览,方便开发测试不用担心路径出错的问题了~~
插件八: GitHub Theme 我个人喜欢用的主题(GitHub Dark)推荐还是很棒的~~
插件九: GitLens — Git supercharged
GitLens 只是帮助您更好地理解代码。快速了解更改行或代码块的人员、原因和时间。回顾历史,以进一步了解代码如何以及为何演变。轻松探索代码库的历史和演变。
插件十: CodeSnap 一款截取VScode代码的插件
- 打开命令面板(在 Windows 和 Linux 上为 Ctrl+Shift+P,在 OS X 上为 Cmd+Shift+P)并搜索
CodeSnap. - 选择要截屏的代码。
- 如果需要,调整屏幕截图的宽度。
- 单击快门按钮将屏幕截图保存到磁盘。
插件十一: Quokka.js 可以实现console.log效果
插件十二、十三: ESLint 和 Prettier - Code formatter 两款插件功能代码检查和格式化
插件十四、十五: Class autocomplete for HTML 和 Beautify css/sass/scss/less
此插件可以美化样式还是不错的,想让自己的代码好看些可以使用这款插件~~
HTML class="" 属性的智能自动完成,还是值得推荐的~~
插件十六: Vetur (vue 语法高亮)安装激活 vetur 插件, 代码就有高亮了。右键菜单还会变多一些, 主要多了个格式化文档
插件十七: JavaScript (ES6) code snippets ES6代码片段 进入官方文档介绍
插件十八: Path Intellisense 路径补全
更便捷开发,值得使用的一款~~
差不多了就这些吧,还有一些断点调试、代码检测、复杂圈度等根据自己爱好去学习一下使用吧!!
主要还是赋能一下,当然也是记录一下自己的开发吧~~~~