type
Post
status
Published
date
Oct 16, 2022
slug
notion-next-on-cf
summary
使用 NotionNext 和 Cloudflare Pages 搭建博客
tags
思考
建站
category
学习思考
icon
password
Property
Oct 16, 2022 05:40 PM
请务必先阅读仓库原作者的这篇博客,在其中已经有建站指引. 这边只针对如何在Cloudflare部署NotionNext, 不会对其他内容做说明.
Quick Start
- fork对应仓库 NotionNext
- 部署到CloudFlare Page上
- 创建新的项目`Create a project`, 选择`Connect to Git`(没有关联Github账号的话需要关联上)
- 选择 NotionNext 仓库
- 因为
cf-support才支持部署到`Cloudflare`, 生产分支需要选择cf-support分支 - 框架预设选项选择Next.js, 只需要填写正确构建命令即可
- 环境变量设置, 需要设置
- 保存并部署, 等待部署成功
构建命令:
npm run export构建输出目录:
out
NOTION_PAGE_ID={你的Notion Page ID} 这个填你自己的Notion PageID, 如果不清楚, 则去看文档, 这里不赘述NODE_VERSION=16 设置构建时使用NODE版本VERCEL_ENV=production 这个环境变量决定是否把文章静态渲染出来, 如果没有则部署完无法查看文章内容, 会显示博客文章404
- 给Pages设置自己的域名, 这个自己去探索吧. 没什么可说的.
已知问题
- 因为没解决`react-messenger-customer-chat`依赖无法正常安装的问题, 所以删掉了该依赖和相关的组件(
FacebookMessenger), 因此部署后的博客将不支持这一扩展. 因为我不使用Facebook, 所以这一修改对我没影响.
- 部署在Cloudflare, 因为是纯静态的, 导致站内的搜索功能不可用, 会一直404, 这个应该可以解决, 有空研究下.
- Cloudflare Page的在大陆的可访问性未知, 可能存在无法连接或者加载速度慢的问题