MarkDown中无法正确插入图片的解决方案

  今天在写博客的时候第一次有插入图片的需求，但是最开始反复修改都无法在远端成功部署图片，以下是亲测有效的解决方案。

Reference

• [2024] hexo图片无法加载究极解决方案

## 修改_config.yml文件   先将 _config.yml 文件中的 post_asset_folder 选项设为 true。

# _config.yml

# Writing
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link:
  enable: true # Open external links in new tab
  field: site # Apply to the whole site
  exclude: ''
filename_case: 0
render_drafts: false
post_asset_folder: true
relative_link: false
future: true
syntax_highlighter: highlight.js
highlight:
  line_number: true
  auto_detect: false
  tab_replace: ''
  wrap: true
  hljs: false
prismjs:
  preprocess: true
  line_number: true
  tab_replace: ''

  此步骤使得我们在使用`hexo n xxx`指令新建文章时，相同路径下会自动新建一个同名文件夹，用以专门存放我们将要使用到的图片。
  注：对于更改设置前已经创建过的md文件，手动新建一个同名文件夹的效果是一样的，已测试。

安装插件

  笔者操作过程中的错误就出现在这一步。

  在大多数教程中介绍的都是要安装hexo-asset-image插件，但事实上由于年久失修，这个插件已经失效。因此，我们实际要安装的是hexo-asset-img插件，所需命令如下所示。

npm install hexo-asset-img --save

  注：如果先前已经安装过hexo-asset-image插件的话，需要前往/node_modules中找到同名文件夹并删除。

文内代码

  随后在md文件中想要插入图片的位置键入下方类似代码即可实现图片插入功能。

! [](md01/md01_pic01.png)

<!-- Markdown支持html语法，因此也可以写成以下形式 -->

< img align=middle src="md01/md01_pic01.png" />

  注：上述示例代码的第一个字符后的空格在实际应用时都不应存在。示例中若无空格即出现乱码，尚无解决方案故出此下策，请读者注意甄别。