跳转到正文
青云 Qingyun
返回

如何在 AstroPaper 中集成 Giscus 评论

更新于:
编辑此页

静态博客部署简单、性能好,但原生互动能力有限。Giscus 基于 GitHub Discussions,为静态站补齐评论能力。

目录

Giscus 的工作方式

Giscus 通过 GitHub API 读取和写入 Discussions。页面端嵌入脚本后,登录 GitHub 的用户即可评论。

这是一种无服务端方案:评论数据存储在 GitHub,前端按需加载。

前置条件

缺少任一条件都无法正常集成。

快速集成(脚本方式)

在 giscus.app 完成配置后,会生成一段 script 标签。可放到文章详情页(如 PostDetails.astro)中,通常放在分享按钮下方。

进阶集成(支持亮暗主题)

如果你希望评论区随站点主题切换:

  1. 安装 @giscus/react 与 Astro React 集成
  2. 新建 Comments.tsx 封装组件
  3. 监听系统主题与主题按钮切换
  4. 在 PostDetails.astro 中挂载组件

配置常量

建议把 repo、repoId、category、lang 等参数放到 src/constants.ts 的 GISCUS 对象,方便统一维护。

注意事项

总结

如果你希望博客具备长期讨论能力,Giscus 是很轻量且稳定的方案。对 AstroPaper 来说,基础接入和主题联动都比较顺滑。


编辑此页
分享这篇文章:

上一篇
AstroPaper 文章的动态 OG 图生成
下一篇
AstroPaper 5.0