起因

在使用Icarus的过程中，需要制作一个阅读列表，我的想法是，在列出图书列表之后，使用Icarus自带的相册功能将书籍封面列出来，所以，我按照官方的示例，写了如下代码：

<div class="justified-gallery">
![数学之美 （第二版）](https://imgs.borgor.cn/imgs20190625155731.png)
![Effective DevOps](https://imgs.borgor.cn/imgs20190625111409.png)
![持续交付：发布可靠软件的系统方法](https://imgs.borgor.cn/imgs20190625111423.png)
![图解TCP IP(第5版)](https://imgs.borgor.cn/imgs20190625111452.png)
</div>

链接

发现，hexo渲染出来的内容如下：

![数学之美 （第二版）](https://imgs.borgor.cn/imgs20190625155731.png) ![Effective DevOps](https://imgs.borgor.cn/imgs20190625111409.png) ![持续交付：发布可靠软件的系统方法](https://imgs.borgor.cn/imgs20190625111423.png) ![图解TCP IP(第5版)](https://imgs.borgor.cn/imgs20190625111452.png)

问题

直接将markdown原样输出了

解决

// markdown的html内容中，上下添加空行
<div class="justified-gallery">

![数学之美 （第二版）](https://imgs.borgor.cn/imgs20190625155731.png)
![Effective DevOps](https://imgs.borgor.cn/imgs20190625111409.png)
![持续交付：发布可靠软件的系统方法](https://imgs.borgor.cn/imgs20190625111423.png)
![图解TCP IP(第5版)](https://imgs.borgor.cn/imgs20190625111452.png)

</div>

但是出现了一个新问题

markdown渲染时会自动在添加一个p标签：

<div class="justified-gallery">
	<p>  <!-- <=== 就这里  -->
		<img src="https://imgs.borgor.cn/imgs20190625111151.png" alt="人类简史：从动物到上帝">
		<br>
		<img src="https://imgs.borgor.cn/imgs20190625111220.png" alt="三体全集">
		<br>
		<img src="https://imgs.borgor.cn/imgs20190625111101.png" alt="哲学家们都干了些什么?">
		<br>
		<img src="https://imgs.borgor.cn/imgs20190625111325.png" alt="星空的琴弦">
		<br>
		<img src="https://imgs.borgor.cn/imgs20190625111310.png" alt="《时间的形状:相对论史话》(彩图升级版)">
	</p> <!-- <=== 和这里  -->
</div>

所以，修改gallery.js文件：

// themes/icarus/source/js/gallery.js
$(function(){
    if (typeof ($.fn.justifiedGallery) === 'function') {
+      let justifiedGallery = $('.justified-gallery')
+      if(justifiedGallery.length > 0) {
+        for (let i = 0; i < justifiedGallery.length; i ++){
+          let html = justifiedGallery[i].childNodes[0].innerHTML
+          justifiedGallery[i].innerHTML = html
+        }
+      }
+      justifiedGallery.justifiedGallery({
        cssAnimation: true,
        imagesAnimationDuration: 1000
      });
    }
    if (typeof ($.fn.lightGallery) === 'function') {
        $('.article').lightGallery({ selector: '.gallery-item' });
    }
})

手动删除p标签

新问题

在hexo-neat压缩代码时，修改过的这里会报错，导致gallery.js最后输出的是个空文件，原因没有深究。

所以如果开启了代码压缩的情况下，需要在全局配置文件_config.yml中设置不要压缩这个文件。

# 压缩 js
neat_js:
  enable: true
  mangle: true
  output:
  compress:
  exclude:
    - '**/gallery.js'
    - '**/clipboard.js'
    - '**/back-to-top.js'

完美解决