VSCode为Markdown自动生成目录，解决目录不整齐问题

本是古典何须时尚 2022-02-13 13:41 1156阅读 0赞

# VSCode为Markdown自动生成目录，解决目录不整齐问题 #

作者：吴甜甜   
    个人博客主页：wutiantian.github.io

--------------------

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTQxNzEwOTE_size_16_color_FFFFFF_t_70]一 、下载插件  
步骤：  
（1）在软件中心，搜索“Markdown”，在列表里选择Markdown的插件。  
（2）例如“Markdown TOC”，这是一个专门生产目录的插件。点击安装

二、可能出现的问题及解决  
VSCode中Markdown目录显示异常

更新VSCode之后打开已经生成目录的Markdown文件，TOC标签格式异常出现如下auto的文字  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTQxNzEwOTE_size_16_color_FFFFFF_t_70 1]

点击界面左下方的设置按钮，然后选择设置进入到用户设置界面。  
打开用户设置之后在搜索设置里面搜索Eol。  
找到文件的Eol可以看到默认行尾字符设置为auto。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTQxNzEwOTE_size_16_color_FFFFFF_t_70 2]

点击选项框然后将auto更改为\\n换行符即可。

回到Markdown编辑界面然后重新生成Markdown目录就能显示正常了。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTQxNzEwOTE_size_16_color_FFFFFF_t_70 3]原因分析：默认行尾字符格式问题。

不同平台对换行符的制定不同，在自动转换保存时有所不同

<table> 
 <thead> 
  <tr> 
   <th>系统</th> 
   <th>换行符</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>windows</td> 
   <td>\n\r</td> 
  </tr> 
  <tr> 
   <td>unix</td> 
   <td>\n</td> 
  </tr> 
  <tr> 
   <td>mac</td> 
   <td>\r</td> 
  </tr> 
 </tbody> 
</table>

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTQxNzEwOTE_size_16_color_FFFFFF_t_70]: /images/20220213/cea0987471b34fe9b8f313bd517f3042.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTQxNzEwOTE_size_16_color_FFFFFF_t_70 1]: /images/20220213/582c47be9663480bbba6c98d17d992f5.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTQxNzEwOTE_size_16_color_FFFFFF_t_70 2]: /images/20220213/f27a553330904cfe83c2cdb8dbe41d82.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTQxNzEwOTE_size_16_color_FFFFFF_t_70 3]: /images/20220213/74e0e250a02046d6b8ecda25cb54cc0d.png