资源文件夹

全局资源文件夹

¥Global Asset Folder

资源是 source 文件夹中的非帖子文件，例如图片、CSS 或 JavaScript 文件。例如，如果你只打算在 Hexo 项目中使用一些图片，那么最简单的方法是将它们保存在 source/images 目录中。然后，你可以使用类似 ![](/images/image.jpg) 的东西来访问它们。

¥Assets are non-post files in the source folder, such as images, CSS or JavaScript files. For instance, If you are only going to have a few images in the Hexo project, then the easiest way is to keep them in a source/images directory. Then, you can access them using something like ![](/images/image.jpg).

帖子资源文件夹

¥Post Asset Folder

对于希望定期提供图片和/或其他资源的用户，以及对于那些喜欢按帖子分离资源的用户，Hexo 还提供了一种更有条理的方式来管理资源。可以通过将 _config.yml 中的 post_asset_folder 设置设置为 true 来启用这种稍微复杂但非常方便的资源管理方法。

¥For users who expect to regularly serve images and/or other assets, and for those who prefer to separate their assets on a post-per-post basis, Hexo also provides a more organized way to manage assets. This slightly more involved, but very convenient approach to asset management can be turned on by setting the post_asset_folder setting in _config.yml to true.

_config.yml

post_asset_folder: true

启用资源文件夹管理后，每次使用 hexo new [layout] <title> 命令创建新帖子时，Hexo 都会创建一个文件夹。此资源文件夹将与与帖子关联的 markdown 文件同名。将与你的帖子相关的所有资源放入关联文件夹中，你将能够使用相对路径引用它们，从而使工作流程更轻松、更方便。

¥With asset folder management enabled, Hexo will create a folder every time you make a new post with the hexo new [layout] <title> command. This asset folder will have the same name as the markdown file associated with the post. Place all assets related to your post into the associated folder, and you will be able to reference them using a relative path, making for an easier and more convenient workflow.

用于相对路径引用的标签插件

¥Tag Plugins For Relative Path Referencing

使用普通 markdown 语法和相对路径引用图片或其他资源可能会导致存档或索引页上的显示不正确。社区已创建插件来解决 Hexo 2 中的此问题。但是，随着 Hexo 3 的发布，核心中添加了几个新的 标签插件。这些使你能够更轻松地在帖子中引用你的资源：

¥Referencing images or other assets using normal markdown syntax and relative paths may lead to incorrect display on archive or index pages. Plugins have been created by the community to address this issue in Hexo 2. However, with the release of Hexo 3, several new tag plugins were added to core. These enable you to reference your assets more easily in posts:

{% asset_path slug %}
{% asset_img slug [title] %}
{% asset_link slug [title] %}

例如，在启用帖子资源文件夹的情况下，如果你将图片 example.jpg 放入资源文件夹，如果你使用常规 ![](example.jpg) markdown 语法的相对路径引用它，它将不会出现在索引页上（但是，它将在帖子本身中按预期工作）。

¥For example, with post asset folders enabled, if you place an image example.jpg into your asset folder, it will not appear on the index page if you reference it using a relative path with regular ![](example.jpg) markdown syntax (however, it will work as expected in the post itself).

因此，引用图片的正确方法是使用标签插件语法而不是 markdown：

¥The correct way to reference the image will thus be using tag plugin syntax rather than markdown:

{% asset_img example.jpg This is an example image %}
{% asset_img "spaced asset.jpg" "spaced title" %}

这样，图片将同时出现在帖子内以及索引和存档页面上。

¥This way, the image will appear both inside the post and on index and archive pages.

使用 markdown 嵌入图片

¥Embedding an image using markdown

hexo-renderer-marked 3.1.0 引入了一个新选项，允许你在不使用 asset_img 标签插件的情况下在 markdown 中嵌入图片。

¥hexo-renderer-marked 3.1.0 introduced a new option that allows you to embed an image in markdown without using asset_img tag plugin.

启用：

¥To enable:

_config.yml

post_asset_folder: true
marked:
  prependRoot: true
  postAsset: true

启用后，资源图片将自动解析为其对应帖子的路径。例如，”image.jpg” 位于 “/2020/01/02/foo/image.jpg”，这意味着它是 “/2020/01/02/foo/“ 帖子的资源图片，![](image.jpg) 将被渲染为 <img src="/2020/01/02/foo/image.jpg">。

¥Once enabled, an asset image will be automatically resolved to its corresponding post’s path. For example, “image.jpg” is located at “/2020/01/02/foo/image.jpg”, meaning it is an asset image of “/2020/01/02/foo/“ post, ![](image.jpg) will be rendered as <img src="/2020/01/02/foo/image.jpg">.