用vscode写Markdown时tab键在网页上缩进错误问题

用vscode写Markdown时tab键在网页上缩进错误问题

问题描述

这两天在写博客时,遇到了一个奇怪的错误,就是在博客上传到网站上预览时,代码块中用tab键缩进的空格变成了8空格。我平时用vscode来编写博客,在本地渲染预览时没有问题,显示为4个空格,然而传到博客网站上时就变成8空格,有些奇怪。

博客网站上显示:

本地预览:

问题分析

我一开始以为是我的tab-size设置有误,于是我检查了我的tab-size设置,发现并无问题,就是4个空格。

后来我想起之前在编辑微信公众号时使用的秀米排版编辑器遇到的问题,当时首行缩进不能直接用空格,否则会导致排版错误。于是我又检查了是否是因为自己误用空格或空行导致一些格式错误、渲染错误啥的,重新检查打了一遍后,发现网站上显示还是又有问题,看来并不是空格空行导致的。

解决方案

最终通过查阅资料,解决了这个问题。

解决方案如下:

  • 首先打开vscode的命令窗口(在vscode中用快捷键ctrl + shift + p
  • 然后在命令窗口输入convert,会自动弹出下面这两个命令,我们选择Convert Indentation to Spaces将tab缩进转为空格命令。
  • 然后我们在去博客网站上预览,发现成功变回4空格。

以上问题就成功解决了,成功上传显示无问题后还是挺开心的。

相关推荐
这儿有一堆花1 分钟前
Vue 是什么:一套为「真实业务」而生的前端框架
前端·vue.js·前端框架
全栈前端老曹15 分钟前
【MongoDB】深入研究副本集与高可用性——Replica Set 架构、故障转移、读写分离
前端·javascript·数据库·mongodb·架构·nosql·副本集
NCDS程序员1 小时前
v-model: /v-model/ :(v-bind)三者核心区别
前端·javascript·vue.js
夏幻灵1 小时前
CSS三大特性:层叠、继承与优先级解析
前端·css
小杨同学呀呀呀呀1 小时前
Ant Design Vue <a-timeline>时间轴组件失效解决方案
前端·javascript·vue.js·typescript·anti-design-vue
华玥作者9 小时前
[特殊字符] VitePress 对接 Algolia AI 问答(DocSearch + AI Search)完整实战(下)
前端·人工智能·ai
Mr Xu_10 小时前
告别冗长 switch-case:Vue 项目中基于映射表的优雅路由数据匹配方案
前端·javascript·vue.js
前端摸鱼匠10 小时前
Vue 3 的toRefs保持响应性:讲解toRefs在解构响应式对象时的作用
前端·javascript·vue.js·前端框架·ecmascript
lang2015092810 小时前
JSR-340 :高性能Web开发新标准
java·前端·servlet
好家伙VCC11 小时前
### WebRTC技术:实时通信的革新与实现####webRTC(Web Real-TimeComm
java·前端·python·webrtc