在前端开发中，文档是非常重要的，而 gitbook 是一个很好的文档写作工具，它可以方便地将 markdown 格式的文档转换成静态 HTML 页面。当然，为了让文档更加专业化和美观，我们需要自定义一些样式。那么，如何在 gitbook 中使用图片来自定义样式呢？答案是使用 npm 包 gitbook-plugin-insert-logo-link。
安装
在开始使用之前，我们需要先安装这个 npm 包。打开终端并执行以下命令：
npm install gitbook-plugin-insert-logo-link
安装完成之后，我们需要在 gitbook 的配置文件 book.json 中启用插件。在 book.json 文件中添加以下内容：
{
"plugins": ["insert-logo-link"]
}添加图片链接
现在，我们可以在 markdown 内容中添加图片链接了。比如我们要在文章中添加一个 logo，代码如下：
{% logoLink "Logo Title" "path/to/logo.png" "https://www.example.com/"%}这段代码会生成一个链接，点击链接会跳转到 https://www.example.com/，同时图片链接指向 path/to/logo.png。
需要注意的是，这里使用了特殊的语法 {% logoLink %}。这是 gitbook-plugin-insert-logo-link 定义的语法。在生成 HTML 页面时，这个语法会被转换成合适的 HTML 代码。
示例代码
以下是一个完整的例子。在这个例子中，我们添加了一个 logo 和一个链接到 gitbook 官方网站。
{% logoLink "GitBook" "path/to/gitbook.png" "https://www.gitbook.com"%}这段代码会生成如下 HTML 代码：
<a href="https://www.gitbook.com/">
<img src="path/to/gitbook.png" alt="GitBook">
</a>做一个独一无二的文档
有了 gitbook-plugin-insert-logo-link，我们可以方便地添加图片链接到 gitbook 中，从而做出更加独一无二的文档效果。相信大家都有很多灵感，可以用这个插件实现很多个性化的效果。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005720f81e8991b448e84ba