[其他]VSCode专区

START

1.展示多行的文件导航标签,而非只有1行

1.1打开设置

1.2搜索该设置"workbench.editor.wrap.tabs",并勾选

1.3效果对比

N.在vscode中自定义代码模板

程序员们为了提高编码效率,通常会将一些重复性的 [代码片段,代码框架] 定义为 [代码模板]

代码模板的好处是 , 不必要每次书写重复的基础代码

在Idea中定义这些代码模板非常简单,因为可以基于视图化页面

但vscode没有提供视图化页面,而需要我们去编写底层的代码模板文件,从而定义[代码模板]

这些文件的名字为 css.json  html.json  js.json .... 如下图:

如你所见 vscode针对于不同的语言 给出了不同的json文件 以支持你定义你的代码模板

1.如何找到这些文件

点击左下角设置->

点击用户代码片段->

在搜索框输入对应的xx.json文件->

修改json文件

2.如何使用这些文件(定义代码模板)

参考这个:

 

3.如何将代码转为代码模板文件格式?

手写代码模板文件,效率较为低下,通常我们使用工具,快速的将代码转为代码模板格式,你可以使用下面这个网站

使用该网站: https://snippet-generator.app/

4.如何自定义全局代码模板  ?

在搜索框选择"新建全局代码片段文件"

直接创建.code-snippets后缀的文件 然后定义模板

注意每个目标的作用范围一定要把 js.css.html.vue 都声明上

这样这个模板的作用范围将会非常大

N.在vscode放大和缩小代码

请直接参考该文章:如何在vscode中设置放大缩小代码（亲测有效）_vscode怎么缩小代码-CSDN博客

N.推荐的VSCode插件

1.Chinese (Simplified) (简体中文)

可以将vscode的语言转为简体中文

2.open in browser

允许你在VSCode中使用浏览器打开html文件

使用方式:

打开html文件->右键->选择"open in default browser"

3.Excel Viewer

允许你在VSCode中查看和编辑Excel类型的文件

4.Markdown Preview Enhanced

在vsCode中查看md类型文件:

允许你在VSCode中查看和编辑.md类型的文件

5.IntelliJ IDEA Keybindings

将VSCode的默认快捷键设置,更改为偏好于IDEA的快捷键设置

6.vscode-icons

更好的文件图标

 

7.Vue Language Features (Volar)

支持vue文件的语法高亮,如果没有此插件 那么打开.vue文件 所有代码将会是灰暗的 而非高亮的

8. ESLint

todo 请见专项文章

9. XML

允许你以快捷键的方式,快速格式化xml文件,让整个xml文件变得规范

注意了哈: 如果你'安装了"IntelliJ IDEA Keybindings"的插件后,那么快捷键将是Ctrl+ Shift + L 你没有安装"IntelliJ IDEA Keybindings"插件,那么快捷键是"Alt + Shift + F"

N.持续更新

END