用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空格。

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

相关推荐
G等你下课8 分钟前
告别刷新就丢数据!localStorage 全面指南
前端·javascript
该用户已不存在8 分钟前
不知道这些工具,难怪的你的Python开发那么慢丨Python 开发必备的6大工具
前端·后端·python
爱编程的喵11 分钟前
JavaScript闭包实战:从类封装到防抖函数的深度解析
前端·javascript
LovelyAqaurius11 分钟前
Unity URP管线着色器库攻略part1
前端
Xy91014 分钟前
开发者视角:App Trace 一键拉起(Deep Linking)技术详解
java·前端·后端
lalalalalalalala17 分钟前
开箱即用的 Vue3 无限平滑滚动组件
前端·vue.js
前端Hardy17 分钟前
8个你必须掌握的「Vue」实用技巧
前端·javascript·vue.js
snakeshe101019 分钟前
深入理解 React 中 useEffect 的 cleanUp 机制
前端
星月日20 分钟前
深拷贝还在用lodash吗?来试试原装的structuredClone()吧!
前端·javascript
爱学习的茄子21 分钟前
JavaScript闭包实战:解析节流函数的精妙实现 🚀
前端·javascript·面试