插件列表:
Color Info
这个便捷的插件,将为你提供你在CSS 中使用颜色的相关信息。你只需在颜色上悬停光标,就可以预览色块中色彩模型的(HEX、 RGB、HSL 和 CMYK)相关信息了。
代码片段比对
Partial Diff
SVN
不解释
Vetur
—— 语法高亮、智能感知、Emmet等
包含格式化功能,Alt+Shift+F(格式化全文),Ctrl+K Ctrl+F(格式化选中代码,两个Ctrl需要同时按着)
EsLint
—— 语法纠错
JavaScript(ES6) code snippets
—— ES6语法智能提示以及快速输入,除js外还支持.ts,.jsx,.tsx,.html,.vue,省去了配置其支持各种包含js代码文件的时间
Path Intellisense
—— 自动路劲补全
HTML CSS Support
—— 让 html 标签上写class 智能提示当前项目所支持的样式
vue
emmet
Chinese
设置简体中文 //中文
Auto Rename Tag
//自动重命名配对的HTML / XML标签(必备)
Beautify
//格式化javascript,JSON,CSS,Sass,和HTML
Class autocomplete for HTML
//智能提示HTML class =“”属性(必备)
Code Runner
//非常强大的一款插件,能够运行多种语言的代码片段或代码文件:C,C ++,Java,JavaScript,PHP,Python,Perl,Ruby,Go等等,安装完成后,右上角出现:
点击这个按钮就可以运行你的文件了(必备)
Debugger for Chrome
//让vscode映射 chrome 的 debug功能,使静态页面都可以用 vscode 来打断点调试
Document This
//添加注释块
Filesize
//在底部状态栏显示当前文件大小,点击后还可以看到详细创建、修改时间
Git History
以图表的形式查看git日志
使用command+shift+p(Ctrl+shift+p) 输入git log就可以看到了
GitLens
可以增强 VSCode 内置 Git 的功能。例如 commits 搜索,历史记录和显示的代码作者身份具体功能可以查看Feature list
git日志插件
HTML Snippets
html代码片段(必备)
htmlhint
html代码检测
htmltagwrap
可以在选中HTML标签中外面套一层标签
使用:选择一大段代码,然后按“Alt + W”
Indenticator
突出目前的缩进深度
IntelliSense for CSS class names
智能提示css 的 class 名
Image Preview
鼠标移到路径里显示图像预览
JavaScript Snippet Pack
js代码片段(必备)
jQuery Code Snippets
jQuery代码片段
自动提示jquery,如果是你一个重度JQ使用者,可以考虑安装
Live Sass Compiler
实时编译sass ,不过需要配置,附上我的配置
"liveSassCompile.settings.formats":[ // You can add more {
"format": "compressed",//压缩
"extensionName": ".min.css",//编译后缀名
"savePath": "./css"//编译保存的路径
}
],
使用
markdownlint
markdown语法检查
Node.js Modules Intellisense
可以在导入语句中自动完成JavaScript / TypeScript模块。
npm Intellisense
在导入语句中自动填充npm模块,跟Node.js Modules Intellisense差不多
open in browser
当前的html文件用浏览器打开,类似 webstorm 的那四个小浏览器图标功能,前提条件html 文件必须保存
快捷键alt+b
Output Colorizer
输出提示的文字颜色有一些变化,方便获取关键信息
Prettier
格式化JavaScript / TypeScript / CSS。
Project Manager
工程项目过多时,shift+cmd+p(shift+ctrl+p)然后输入project,第一次选择edit Project编辑自己的工程项目,之后就可以直接选择open打开你的项目
Sass
写sass必备
vscode-faker
生成假数据,地址,电话,图片等等
打开方式shift+cmd+p(shift+ctrl+p)) 然后输入faker 就可以选择了
Quokka.js
实时观看javascript的变量的变化
使用:先shift+cmd+p (ctrl+shift+p)输入 quokka 选择 new javascript 就行了�
Regex Previewer
测试正则的插件
TSLint
检查typescript编程时的语法错误语法
TypeScript Importer
自动搜索工作区文件中的TypeScript定义,并将所有已知符号作为完成项,以允许代码完成。
vscode-icons
目录树图标
react
React-Native/React/Redux snippets for es6/es7
react代码片段,下载人数超多�
VueHelper
vue代码片段
vue-helper (支持CTRL+点击函数跳转 || 绑定对象跳转)
vscode怎么快速查看vue的函数定义
参考:https://blog.csdn.net/Amouzy/article/details/123282132
Vue TypeScript Snippets
vue的 typescript 代码片段
Vue 2 Snippets
vue 2代码片段
Typings Installer
——安装vscode 的代码提示依赖库,基于typtings的,比如提示angular或者jQuery智能感知
JS-CSS-HTML Formatter
——代码对齐。每次保存代码的时候它会自动对齐代码
主题
Dracula Official
个人最喜欢的主题,应该是最好看的主题之一
One Dark Pro
这个也好看
Atom One Dark Theme(老版本)
这个和One Dark Pro差不多,One Dark Pro颜色主题多一些
One Monokai Theme
Eva Theme
里面包含黑色和白色主题,这个白色主题感觉挺好看的
Boxy Theme Kit
Ayu
Ayu提供三种不同的颜色变体,包括深色,浅色和海市rage楼。
它还允许用户使用其自定义的Ayu图标包来实现工作台的统一外观。
该主题是使用Java构建的,因此很容易对其进行修改或扩展其功能。
您可以轻松地从其GitHub存储库中派生此主题,并在此主题之上开始构建。
vscode设置显示代码缩略图
文件–首选项–设置 搜索 minimap 打上对勾就可以了
Bracket Pair Colorizer
颜色识别匹配括号
Code Spell Checker 单词拼写检查
检测代码中单词拼写正确性
我们在编写代码的时候经常会不小心拼写错误造成软件运行失败,安装这个插件后会自动帮我们识别单词拼写错误并且给出修改建议,大大帮我们减轻了排除bug的压力。
CSS Peek
使用此插件,你可以追踪至样式表中CSS 类和 ids 定义的地方。当你在 HTML 文件中右键单击选择器时,选择“ Go to Definition 和 Peek definition ”选项,它便会给你发送样式设置的 CSS 代码。
Better Align
#对齐用的,设置一下快捷键 Ctrl + Alt + =,对块自动等号对齐
Import Cost
引入包大小计算,对于项目打包后体积掌握很有帮助
HTML Boilerplate
通过使用HTML 模版插件,你就摆脱了为 HTML 新文件重新编写头部和正文标签的苦恼。你只需在空文件中输入 html,并按 Tab 键,即可生成干净的文档结构。
TODO Highlight
这个插件能够在你的代码中标记出所有的TODO 注释,以便更容易追踪任何未完成的业务。在默认的情况下,它会查找 TODO 和 FIXME 关键字。当然,你也可以添加自定义表达式。
Rainbow Brackets
为圆括号,方括号和大括号提供彩虹色。这对于Lisp或Clojure程序员,当然还有JavaScript和其他程序员特别有用。
效果如下:
Indent-Rainbow
用四种不同颜色交替着色文本前面的缩进
scss IntelliSense scss 智能提示,补全
AutoFileName (文件路径自动补全插件)
当你需要 require 本地文件时,这个插件将为你提供基于你输入的文件路径的自动补全的选项。
Pigment
遇到颜色代码时,Pigment会将颜色渲染在这段代码的下面。
Settings Sync
Settings Sync 提供了同步个人设置的功能,当我们需要换电脑进行开发时,比如回家用自己的电脑,或者换了新的电脑,该插件可以帮你同步之前做的设置,不需要在每台电脑上都重新设置一次。
vscode 选中后相同内容高亮插件推荐
highlight-icemode
first step
ctrl + shift + p 打开 command panel , 输入 preferences: open user settings 打开用户设置,找到 highlight-icemode 配置项
secode step
将左侧内容复制到右侧可编辑tab 中,设置上自己想要的颜色就ok了。
{
// Set backgroundColor
"highlight-icemode.backgroundColor": "red",
// Set Border Color
"highlight-icemode.borderColor": "blue"
}
vscode中选择HTML标签对高亮
扩展插件中,安装这个插件“VSCode Highlight Matching Tag”
我一点div, vs code这个编辑器把所有的div都高亮了,但是只想高亮闭合的那个div,该怎么设置呢?谢谢
这个问题也困惑我很久了,brackets就可以很好的实现,但是其他功能又没有vsc好用,纠结。
问题解决,把正在编辑的文件识别为html就可以显示高亮显示对应标签了。php文件
手动识别为
,就可以了
vue-beautify
vue文件格式化,有三种用法
1、快捷键ctrl+shift+f ;
2、在文件中右键选择Beautify Vue ;
3、按f1,搜索 Beautify Vue然后点击.
拓展插件
这部分主要介绍一些针对特定开发环境的插件
Vscode-element-helper
使用element-ui库的可以安装这个插件,编写标签时自动提示element标签名称。
https://upload-images.jianshu.io/upload_images/2484592-2c9831f44f9834a7.gif?imageMogr2/auto-orient/strip|imageView2/2/w/992/format/webp
Version Lens 工具包版本信息
在package.json中显示你下载安装的npm工具包的版本信息,同时会告诉你当前包的最新版本。
WakaTime 计算代码工作量
这是一款时间记录工具,它可以帮助你在vs code中记录有效的编程的时间。
并且将数据用折线图的形式展示出来,为你呈现一周内的工作趋势,曾经编写项目的时候最多一天编程将近12个小时,你的付出和努力wakatime都知道。
同时在他的官网中,也会显示用扇形图的形式显示你编写各个语言所占用的时间比例,以及你在各个项目中所用的时间占比,是一个非常好的数据报告,项目结束的时候你可以在它的Dashboard中清晰地看出自己的时间都是如何分配的。
Settings Sync VSCode设置同步到Gist(现已弃用)
有时候我们到了新公司或者换了新电脑需要配置新的开发环境,这时候一个一个下载插件,再重新配置vs code就非常麻烦而且你还不一定记得那么全面,通过这个插件我们可以将当前vs code中的配置上传到Gist,之后再通过Gist下载,就可以将所有配置同步到新环境中了。
点击左侧侧边栏Developer settings,进入开发者设置。
选择Personal access tokens,点击右侧Generate new token。
填写token名称,在下方勾选gist。
点击下方的Generate token按钮生成一个新的token。
将生成的新的token保存下来。
在vscode中安装Settings Sync插件,输入Ctrl+Shift+p输入Sync,选择更新/上传配置。
将github中生成的token输入,点击回车。
在控制台中自动生成一串id,之后便可以通过token和id进行配置同步。
输入Ctrl+Shift+p输入Sync,选择下载配置,输入token和id即可同步下载。
minapp
微信小程序标签、属性的智能补全(同时支持原生小程序、mpvue 和 wepy 框架,并提供 snippets)
colorize
在设置下面直接显示颜色,更直观的知道你设置的是什么颜色,同时也支持Less、Sass的变量
Path Autocomplete
自动提示文件路径
javascript console utils
它的主要功能是快速的生成console.log(),再调试js的过程中难免要打印一些东西,所以快速生成就很爽
下载安装好就可以用了
使用方法:
先选中变量
就会自动生成console.log
调试的时候可能会弄了好多的console.log出来
调试好了之后需要把这些console.log删除掉
就可以删除所有的console.log
local history
修改代码之后想找回历史代码怎么办?
在使用Pycharm、IDEA时可以直接查看本地历史代码,然后轻松恢复之前某个版本。但是,VS Code默认是不支持local history的,所以,仅凭Ctrl+z撤销操作时不行的。何况,撤销操作是把前面步骤所有的操作都撤销了,其中有很多是我们不需要的。
但是,为VS Code配合上local history,所有问问题就迎刃而解了。
安装这款插件之后在侧边栏会出现LOCAL HISTORY的字样,每当我们保存更改时,它都会备份一份历史文件,当我们需要恢复之前版本时,只需要点击一下对应的文件即可。此外,它还会在编辑框显示对比详情,能够让你对修改位置一目了然。
Better Comments
是不是觉得注释信息千篇一律?
Better Comments这款插件可以让VS Code注释信息更加人性化。
它可以根据告警、查询、TODO、高亮等标记对注释进行不同的展示。此外,还可以对注释掉的代码进行样式设置。
您想要的任何其他注释样式都可以在设置中指定
stylelint
CSS / SCSS / Less 语法检查
stylelint是一个 css 规范校验工具,也支持 less 等 css 预处理器。
1.安装扩展
2. 项目初始化
$ npm init -y
3. 安装依赖
yarn add stylelint stylelint-config-standard --dev
4. 添加.stylelintrc.js文件
在项目根目录添加.stylelintrc.js文件并加入如下内容
module.exports = {
extends:'stylelint-config-standard',
rules: {
// your rules
},
// 忽略其他文件,只校验样式相关的文件
ignoreFiles: [
'node_modules/**/*',
'public/**/*',
'dist/**/*',
'**/*.js',
'**/*.jsx',
'**/*.tsx',
'**/*.ts',
],
};
5. 添加index.css
新建index.css并加入以下内容
可以发现,如果样式代码不符合规范,styleint会在代码中给出提示
Error Lens
Error Lens是一款把代码检查(错误、警告、语法问题)进行突出显示的一款插件。
经常与代码打交道的同学都应该清楚,大多数开发工具对于代码进行都是通过下划线的方式进行标识。但是,这样对于代码调试不够直接和友好。
Error Lens 通过使诊断更加突出,增强了语言的诊断功能,突出显示了由该语言生成的诊断所在的整行,并在代码行的位置以行方式在线打印了诊断消息。
它具有如下特性,
更明显地突出显示错误或警告信息
将诊断结果附加到包含诊断信息的任何行的末尾,这意味着你不必上下文切换到问题视图
状态栏显示打开文件的诊断次数(可以配置)
可以配置设置以控制 ErrorLens 显示增强诊断的方式
适用于任何编程语言
Git Graph:
git插件,这个插件也体现出vscode一站式解决问题的决心和能力,如下:
Trailing Spaces
高亮那些冗余的空格,可以快速删掉。
Git Blame
“谁写的这段代码?”
每隔一段时间,你都可能需要了解某段代码是谁写的。正好,Git Blame 就可以帮你。Git Blame 会告诉你最后修改这行代码的人是谁。最重要的是,你可以看到这处修改发生在哪次提交里。
这个信息很有用,特别是当你在某个产品功能分支上开发时尤其有用。当使用产品功能分支开发时,你通过点击以你分支名命名的标签,就可以跳到相应信息。
由于 Git Blame 会告诉你这行代码是在哪个提交和哪个分支上修改的,所以你就知道了哪个标签对应着这次修改。这将帮助你更好地理解这种修改背后的逻辑。
Prettify JSON
格式化JSON,有些没有排版好的JSON免去自己手动排列好。一键格式化效率还是很不错的
Bookmarks
给文件某个位置打标签,用来快速跳转的..不知道这个功能到现在为何没内置!!
Live Saas Compiler
它能帮你实时把 SASS/SCSS 文件编译/转译成 CSS 文件,并且提供在线浏览器重载。
Log File Highlighter日志文件(.log后缀的文件)高亮
Laravel goto view跳转到相应的文件路径
Comment Translate
VSCode 注释翻译
Icon Fonts
这是一个能够在项目中添加图标字体的插件。该插件支持超过 20 个热门的图标集,包括了 Font Awesome、Ionicons、Glyphicons 和 Material Design Icons。
Visual Studio Intellicode
下载超过320万次的Visual Studio Intellicode是Visual Studio下载次数最多的插件之一。而且,在我看来,它是你能用到的最有用的插件之一。这个插件旨在帮助开发人员提供智能的代码完成建议而构建的,并且已预先构建了对多种编程语言的支持。
Visual Studio Intellicode使用机器学习技术来观察和查找众多开源GitHub项目中使用的模式,并在编码时提供建议。
change-case
通常我们对一个变量的命名可能是驼峰,可能是全大写,又或是下划线,这里可通过这个插件解决变量命名规范的问题选中变量配合组合键[Ctrl+Shift+p],输入对应格式即可。extension.changeCase.commands:列出所有“更改案例”命令,如果仅选择一个单词,则带有预览
extension.changeCase.camel:更改大小写'camel':转换为字符串,并用下一个字母大写表示分隔符
extension.changeCase.constant:更改大小写“常量”:转换为大写字母,下划线分隔字符串
extension.changeCase.dot:更改大小写的“点”:转换为小写,句点分隔的字符串extension.changeCase.kebab:更改大小写“ kebab”:转换为小写字母,用破折号分隔的字符串(参数名的别名)
extension.changeCase.lower:更改大小写为“小写”:转换为小写的字符串
extension.changeCase.lowerFirst:更改大小写“ lowerFirst”:转换为首字母小写的字符串
extension.changeCase.no:转换没有任何大小写的字符串(小写字母,空格分隔)
extension.changeCase.param:更改大小写为'param':转换为小写字母,用破折号分隔的字符串
extension.changeCase.pascal:更改大小写“ pascal”:转换为以与camelCase相同的方式表示的字符串,但首字母也大写
extension.changeCase.path:更改大小写的“路径”:转换为小写,用斜杠分隔的字符串
extension.changeCase.sentence:更改大小写的“句子”:转换为小写的空格分隔的字符串
extension.changeCase.snake:更改大小写“ snake”:转换为小写字母,下划线分隔字符串
extension.changeCase.swap:更改大小写“交换”:转换为每个大小写相反的字符串
extension.changeCase.title:更改大小写“标题”:转换为以空格分隔的字符串,每个单词的第一个字符均大写
extension.changeCase.upper:更改大小写为大写:转换为大写字符串
extension.changeCase.upperFirst:更改大小写为“ upperFirst”:转换为首字母大写的字符串
EditorConfig for VS Code
代码风格统一
配置参考:https://blog.csdn.net/qq_24147051/article/details/85244267
Git History Diff :寻找每一个git分支上面提交过的节点,并可以对比差异性。
Angular Extension pack: 集成了很多提升Angular开发效率的插件
解决Vscode提示code安装似乎损坏
参考:https://blog.csdn.net/liuarmyliu/article/details/107370535
vs code显示扩展宿主意外终止该怎么办?
卸载:Live Sass Compiler,Live Server
CSS Navigation:快速跳转到CSS的类定义
css-auto-prefix:写CSS时不再为浏览器前缀发愁
Git 集成插件
GitHub Pull requests
在Visual Studio Code中查看和管理GitHub拉取请求和问题
guides
显示代码对齐辅助线,很好用
JavaScript Booster
这款神器可以在我们代码写的不规范或者有待调整的地方,在光标聚焦后,会有一个小灯泡。会提示对应的不合理原因和改进方案。极大的提高了我们的代码优雅度,强烈推荐
让您的生活更轻松,使用代码操作为您执行重复性任务!他们可以提供很多帮助,只需跟随灯泡!
当在JavaScript(或TypeScript / Flow)中编辑代码时,此VS Code扩展提供了各种代码操作(快速修复)。只需注意左侧的灯泡,然后按一下它即可了解如何在光标下转换代码。
Cocos Creator JS
JavaScript 代码支持函数跳转
Cocos Creator 支持 JavaScript 和 TypeScript 两种语言,如果你是用 VS Code 来开发 Cocos Creator 的 js 项目,那你的编程体验应该不是很好,因为 Cocos Creator 的组件脚本是一套自定义的结构,
下面是预览效果:
js代码支持函数跳转
js代码提示
模块跳转
path-alias 一个可以解决路径别名提示,跳转的vscode插件禁用卸载
参考:https://juejin.cn/post/6844903954376032269
Tabnine
智能提示代码,可以预测你将要写的代码进行提示
Template String Converter
在字符串中输入$触发,将字符串转换为模板字符串
Parameter Hints
提示函数的参数类型及消息
vue-component
输入组件名称自动导入找到的组件,自动导入路径和组件
选中后自动输入组件名(包含必填属性)、import语句、components属性
CSS Initial Value
显示每个CSS属性的初始值,当光标停留在css属性时
A-super-translate
翻译识别代码中注释部分,不干扰阅读。支持不同语言,单行、多行注释、
支持用户字符串与变量翻译,支持驼峰拆分
使用方法:选中行,Ctrl+Shift+p 输入 翻译
键入 ctrl+`再按下 ctrl+1 为翻译直接替换选中区域
vue-format(4个空格,格式化,好用)
Todo Tree 纪录代码位置,快速定位代码
Prettier ESLint
Csscomb
css 、less、sass 的代码格式化。
DotENV
支持.env文件语法,高亮显示
Volar
与vetur相同,volar是一个针对vue的vscode插件,支持.vue文件的语法支持、高亮显示、格式校验、错误检测等,不过与vetur不同的是,volar提供了更为强大的功能
Nested Comments
嵌套注释一直是个问题。
因为被嵌套的注释会和第一个注释开头组合成有效的注释,而后面的部分将会被忽略。
下载地址:marketplace.visualstudio.com/items?itemN…
Hungry Delete
这个插件帮助我们一键删除多个空行。
按住 Option+Delete 就可以删除多个空行。
vscode-styled-components
功能:在JS文件中写样式时,有智能提示
Echars 智能提示插件
提示各种Echar中Option 的属性,挺强大的
Auto import 自动导入包
Sort Typescript imports
import自动排序
Code Time
Code Time 可以计算我们使用 Visual Studio Code 的时间,提供了多种数据指标。
css-class-intellisense (这个适用于先在css写了样式,在html中写入样式时提示)
HTML to CSS autocompletion (这个适用于先在html写了样式,在css中写入样式时提示)
Can I Use HTML5、CSS3、SVG的浏览器兼容性检查
Dash 集成Dash
Less IntelliSense less变量与混合提示
PostCss Sorting css排序
gitignore .gitignore文件语法
Error Gutters
File Peek 根据路径字符串,快速定位到文件
Find-Jump 快速跳转到指定单词位置
VS Code Counter
统计代码总行数、注释行数、空白行数,以及使用的语言。
any-rule
可以在vscode里快捷使用正则表达式,不需要借助度娘了!
方式1:
按F1(mac下fn+F1)打开正则列表. -- 有的需要 配合 fn+f1使用
输入关键词搜索, 比如"手机".
方式2:
右键选择"🦕正则大全".
方式3:
在代码任意位置输入"@zz".
Black Box
Blackbox 是一款强大的 VSCode 扩展,可以帮助开发人员更快、更准确地编写代码。它包含四个主要功能:代码自动补全、仓库搜索、代码搜索和 Jupyter Lab & Notebooks。通过代码自动补全,开发人员可以获得超过20种编程语言的代码建议,包括 Python、JavaScript、TypeScript、Go 和 Ruby,只需按 Enter 键即可。为了获得更好的准确性,建议在您要构建的函数上添加良好的注释。Blackbox 仓库搜索允许开发人员搜索不同语言的超过1亿个仓库文件,包括 Python、JavaScript、TypeScript、Java 等。这个功能直接集成在 VSCode 中,因此开发人员不需要离开他们的 IDE 在线搜索特定的仓库。Blackbox 代码搜索帮助开发人员找到最佳的代码片段,在构建出色的产品时使用。只需几个简单的步骤,开发人员就可以获取超过20种编程语言的代码片段,包括 Python、Java、C 和 C++、C#、JavaScript、SQL、PHP、Go、TypeScript、Kotlin、MATLAB、R、Swift、Rust、Ruby、Dart 和 Scala。最后,Blackbox 还提供了对 Jupyter Lab & Notebooks 的支持,允许开发人员和数据科学家在构建出色的产品时找到最佳的代码片段。通过 Blackbox Chrome 扩展,开发人员可以在行首使用注释符号并编写问题,以立即获得代码建议。总的来说,Blackbox 是任何想要像想法一样快速编写代码的开发人员必备的扩展。
根据需求,大家安装对应插件即可(安装太多插件,VSCode会很卡)
当然电脑配置足够强大,当我没说🤔
修改终端颜色:
在网站上找到配色
https://glitchbone.github.io/vscode-base16-term/#/default-dark
替代你喜欢的配色,最后查看终端
安装angular 需要的插件:
Angular 7 Snippets:Angular语法填充(标签)
Angular Files:生成Angular的文件模板(Component、Module、Pipe等等)
Angular Follow Selector:文件跳转(Component跳转到html、scss文件)
Angular Language Service:引用填充和跳转到定义(html中进行引用补全)
参考:https://www.cnblogs.com/binky/p/12672242.html
vscode右键打开文件
vscode 总是报正在运行“Prettier - Code formatter”格式化程序(配置)。等,卸载一下vscode,重新安装一下就好了
彻底卸载vscode:
参考:https://www.cnblogs.com/muou2125/p/10388440.html
VSCode对于Three.js的补全提示,vscodethree.js
1.首先,你要安装Node.js
2.在vscode的 查看-> 集成终端中 输入
npm install --save @types/three
3.完成后,在my.js 同级建立文件jsconfig.json空文件
4打开my.js 就有自动补全了。
一些快捷键
参考:https://blog.csdn.net/x1037490413/article/details/86758644
修改代码之后想找回历史代码怎么办?
在使用Pycharm、IDEA时可以直接查看本地历史代码,然后轻松恢复之前某个版本。但是,VS Code默认是不支持local history的,所以,仅凭Ctrl+z撤销操作时不行的。何况,撤销操作是把前面步骤所有的操作都撤销了,其中有很多是我们不需要的。
但是,为VS Code配合上local history,所有问问题就迎刃而解了。
安装这款插件之后在侧边栏会出现LOCAL HISTORY的字样,每当我们保存更改时,它都会备份一份历史文件,当我们需要恢复之前版本时,只需要点击一下对应的文件即可。此外,它还会在编辑框显示对比详情,能够让你对修改位置一目了然。
VScode如何快速生成Html标签(Emmet的简单使用)
参考:https://blog.csdn.net/Cloud1209/article/details/104183069
最近vscode 更新了之后偶然发现,折叠地代码之后,结束的大括号没有显示出来,而是只显示省略号,感觉很不方便,如下图:
参考:https://www.cnblogs.com/fxwoniu/p/13899402.html
彻底卸载 VSCode
win + r 打开运行 回车
地址栏输入 %userprofile% 回车
删除 .vscode 文件夹
win+R输入%appdata%
删除 Code 和 Visual Studio Code 文件夹
国内下载vscode速度慢解决
找到相应的.exe后,谷歌按ctrl+j,打开下载的文件, 复制 VScode 下载链接;然后在 新的窗口 粘贴链接。将 链接中 http://az764295.vo.msecnd.net 替换为 http://vscode.cdn.azure.cn 就可以解决了,
参考:https://blog.csdn.net/t1506376703/article/details/100129923?spm=1001.2101.3001.6661.1&utm_medium=distribute.pc_relevant_t0.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-1.pc_relevant_aa&depth_1-utm_source=distribute.pc_relevant_t0.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-1.pc_relevant_aa&utm_relevant_index=1
setting sync 下载不了,出现Sync: 错误信息已打印在控制台 (帮助 > 切换开发人员工具)。
VScode登录不了Leetcode进行刷题秒杀解决方案
参考:https://blog.csdn.net/Protinx/article/details/121025338
在VsCode中使用LeetCode插件
参考:https://blog.csdn.net/u011895157/article/details/125042359
VSCode下使用Leetcode不能提交代码怎么办!?
参考:https://blog.csdn.net/uzwuzw/article/details/109384848
简单一步到位同步你的 VSCode 全部配置
参考:https://blog.csdn.net/weixin_43131046/article/details/123118022
vscode同步扩展设置(Settings Sync)
参考:https://segmentfault.com/a/1190000021745980
settings Sync 上传失败
参考:https://www.jianshu.com/p/f6a68d815815
vscode处理代码合并冲突
参考:https://blog.csdn.net/weixin_47981445/article/details/124328280
vs code 出现html js css 注释不正常
参考:https://blog.csdn.net/sunny327/article/details/89335911
那些你应该考虑卸载的 VSCode 扩展
参考:https://blog.csdn.net/weixin_32210881/article/details/112145398
vscode设置字体
参考:https://blog.csdn.net/web15185420056/article/details/123266347
1、字体设置( JetBrains Mono )
管理 -> 设置
字体大小: 20
字体系列:JetBrains Mono
注:
在 VSCode 中 “控制字体系列” 添加字体名称 (优先级:从左至右)
同时还要在对应的电脑操作系统中安装字体才能生效
推荐:
在 VSCode 中推荐使用 JetBrains Mono 编程专用字体
JetBrains 公司最新出了一个字体 JetBrains Mono,据称是专为改善看代码体验而生
2、下载字体
JetBrains Mono 官方下载地址 :https://www.jetbrains.com/lp/mono/
点击 Download font 下载
3、在电脑中安装字体
安装
下载后解压,进到ttf 文件夹下,会有一堆文件,全选后安装
所有的字体都叫 JetBrains Mono,全选安装的目的是为了响应各种特殊字体(比如斜体、意大利体、粗体、如果不需要这些花里胡哨的只需安装 Regular.ttf)
4、在 VSCode 中启用查看字体
如需要 Consolas 字体:如下
windows 下 VScode 使用 Consolas 下载地址:https://www.fonts.net.cn/font-33390313417.html
VSCode 安装教程(超详细)
参考:https://blog.csdn.net/weixin_44950987/article/details/128129613
关于VScode每次保存/修改文件后都会自动生成一个打包文件dist的问题
参考:https://blog.csdn.net/weixin_45249263/article/details/123232030
scss注释不了,卸载
VsCode 中的Vetur报错
大概意思是找不到Vetur can't find tsconfig.json or jsconfig.json in