共计 1363 个字符，预计需要花费 4 分钟才能阅读完成。
1. Gitalk 说明
Gitalk 是一个基于 GitHub Issue 和 Preact 开发的评论插件。
Gitalk 的特性：
1、使用 GitHub 登录 2、支持多语言 [en, zh-CN, zh-TW, es-ES, fr, ru]3、支持个人或组织 4、无干扰模式（设置 distractionFreeMode 为 true 开启）5、快捷键提交评论（cmd|ctrl + enter）
使用 Gitalk 需要你做一些提前准备：1、在 github 上创建一个仓库，Gitalk 会把评论放在这个仓库的 issues 里面。2、在 github 上申请一个 GitHub Application，来让 Gitalk 有权限操作 github 上的仓库。
2. 安装使用
2.1 安装
两种方式引入：
1、直接在 HTML 文件中引入
<link rel=”stylesheet” href=”https://unpkg.com/gitalk/dist/gitalk.css”>
<script src=”https://unpkg.com/gitalk/dist/gitalk.min.js”></script>
建议直接把文件下载后放在项目目录中，这样就可以不再依赖第三方网络了。
2、通过 npm 安装
npm i –save gitalk
import ‘gitalk/dist/gitalk.css’
import Gitalk from ‘gitalk’
2.2 使用
1、首先需要在 html 文件中添加一个容器，Gitalk 组件会在此处显示
<div id=”gitalk-container”></div>
2、使用下面的 JavaScript 代码来生成 Gitalk 评论：
var gitalk = new Gitalk({
clientID: ‘GitHub Application Client ID’,
clientSecret: ‘GitHub Application Client Secret’,
repo: ‘GitHub repo’,
owner: ‘GitHub repo owner’,
admin: [‘GitHub repo owner and collaborators, only these guys can initialize github issues’],
id: location.pathname, // 确保唯一，并且长度小于 50
distractionFreeMode: false // 类似 Facebook 评论框的全屏遮罩效果.
})
gitalk.render(‘gitalk-container’)
里面参数下面会讲解. 配置好后，页面最终效果 (https://gitalk.github.io/)：
3. new Gitalk 的参数说明
new Gitalk 的参数中有 github 的仓库信息和 GitHub Application 信息，所以首先我们创建这两个。
首先你需要在 github 上创建一个仓库和申请一个 GitHub Application。在 github 上创建一个仓库比较简单这里就不讲解了，下面讲一下如何申请一个 GitHub Application
注意：如果你打算在自己网站使用 Gitalk，并且这个网站的源码在 github 的仓库上，那么你也可以直接使用这个仓库，Gitalk 只使用仓库的 Issues。
3.1 申请一个 GitHub Application
参考资料
Gitalk 官网 Gitalk 中文文档