问题描述:最近写使用markdwon写博客,本人习惯在本地用visual studio code编写,然后上传。vs code自带一个侧边预览窗口(右上角)可以查看markdown文档结果。平时也是用这个。后面写博客发到自己个人的网站上时,发现有时候 tab 键缩进 4个空格,有时候缩进 8个空格。
如图:第一个图是网页上的效果,可以看到一些 tab缩进是4,有一些是8
下面是我这篇博客本地文件及效果:可以看到文件中缩进均是一个tab键,同时采用vs code的自带预览效果都是缩进4个空格。但是与实际网页的效果不同。
后面我还尝试在csdn在线的markdown编写,一个tab缩进4个空格,但是我导出markdown上传到自己个人网站还是发现有tab出错。
一开始我以为是我的 tab-size实质错误,但是我始终的设置的是4。如下图:
后面我尝试使用了一款vs code中的Markdown Preview Enhanced插件,利用该插件进行预览而不是使用默认自带的预览工具。利用该工具后,还是预览上面的那段代码,发现效果和我实际网页上显示的效果一致,有部分tab缩进为8空格。
解决
最终,经过一番查找资料,我们可以将 tab缩进转换成空格来消除 tab 缩进引起问题。在vs code中我们按Ctrl + Shift + p
,调出命令窗口,输入 convert 就可以看到下面两个命令,我们选择 convert Indentation to Spaces
命令将文件中得到缩进转换为空格。然后我们再用 Markdown Preview Enhanced进行预览。发现此时所有的tab 都是缩进 4个空格。
下图是转后后的效果,完成了对tab缩进不一致的问题修复。后面我们还可以
再尝试命令convert Indentation to Tabs
,我们会发现又出现刚才缩进不一致的现象。