一、VPS搭建指北
（一）pm2普通搭建
搭建前准备
一台VPS、安装好Git、npm包管理工具（或者可以安装npm版本管理工具nvm，本文使用nvm演示）
1️⃣ 拉取NotionNext源代码
cd 进入需要存放源代码的文件，E.g. cd /var/www/html。通过Git工具克隆源代码 git clone [email protected]:Your_accont/NotionNext.git2️⃣ 打包前需要做的准备
3️⃣ 打包并运行
4️⃣ 后台运行
完成第三步骤之后我们发现Blog项目是在我们前台运行，当我们退出交互模式后，运行的项目就会中断。为此我们需要换一种思路，将其改为后台运行，刚刚好pm2库就刚刚好满足我们的需求。
以下补充pm2库的其他命令：
pm2 ls：列出所有正在运行的应用程序
pm2 show [id|name]：查看应用程序详细数据
pm2 list | grep 'Project-name' | wc -l：查看某个项目的运行数量
pm2 stop [id|name]：停止应用程序运行
pm2 delete [id|name]：停止应用程序运行
pm2 monit：打开监控应用程序面板
pm2 start：使用pm2运行项目，例如我们的博客项目就采用pm2 start yarn --name $PM2_PROJECT_NAME -- start -- -p $PORT命令运行
当然了，pm2不仅仅是可以监控前端项目，也可以监控python脚本或者Java。
（二）jenkins自动化部署
搭建前准备
服务器中已安装以下应用：Jenkins及相关插件、npm/nvm，如未安装详见 和
⚠️ 需要注意的是Jenkins和nvm搭配可能对于pm2库运行出现问题，解决办法是使用与npm命令时候进行初始化nvm，以下是「Build Steps」-「执行shell」的参考代码，
NVM_DIR 需要改成实际的路径。二、其他部署方案
（一）概述
更新日期为 2024-06-30
项目除了提供VPS部署方案外，还有Vercel、Netlify、4EverLand、CloudFlarePage和Zeabur五种部署方法。
⚠️ 需要注意，CloudFlarePage和Zeabur这两种部署方法本质上是将Notion笔记转换为静态html文件，所以笔记发生修改之后不会触发更新，需要重新手动部署。
各个部署方式详细步骤请参照以下官网
使用线上的云服务部署大多数流程都是注册登录、授权仓库访问权，然后设置环境变量等等就可以愉快部署啦。
如果你有类似经验，可以直接阅读以下注意事项和难点即可😉~
（二）Vercel部署和自定义域名
最重要是在「Environment Variables」中添加「NOTION_PAGE_ID」属性和对应的
pageId 其他流程暂时忽略😈。部署完成后进入设置界面
然后去到我们的DNS服务商（在本案例中使用Cloudflare进行演示）中添加A记录（或者CNAME记录），指向
76.76.21.98（或者 cname-china.vercel-dns.com），此时不用魔法🪄也能访问啦。
💡 经过试验，在测试中使用A记录访问速度更快且不需要魔法，所以建议使用A记录。
部署效果预览
（三）Netlify部署和自定义域名
最重要是在「Environment Variables」中添加「NOTION_PAGE_ID」属性和对应的
pageId 其他流程暂时忽略😈。部署完成后进入设置界面：
假设使用子域名，需要再次确认：
然后去到我们的DNS服务商（在本案例中使用Cloudflare进行演示）中，根据文档提示添加CNAME记录，指向
zabanya-blog.netlify.app。部署效果预览
（四）4everland部署和自定义域名
1️⃣ 通过Github登录4everland
2️⃣ 在「Hosting」-「Projects」界面创建项目
3️⃣ 以下几个红色框框的选项是需要修改的
⚠️ 部署完成后会有小几分钟的项目预热时间，此时访问博客界面会异常。
4️⃣ 然后我们进入域名配置环节，该步骤跟前面两节类似，先填入我们预期的用户名，然后在DNS服务商中添加对应的记录（添加A记录还是CNAME记录根据不同云服务商的文档决定）
⚠️ 需要注意的是，4everland对于配置的响应较慢，可以先尝试将代理状态改成「仅DNS」，配置识别后改回「已代理」
部署效果预览
（五）CloudFlarePage×自定义域名×定时部署
根据NotionNext官方文档提示，CloudFlare方案适用于站点访问量大，而文章更新不频繁的用户。
1️⃣ 项目部署
首先创建帐号并且登录，进入「Pages」界面并且「连接到Git」，授予仓库访问权
然后到项目部署的配置环节，部分需要修改的参数如下如所示，在4.0.9之后的版本对分支没有特别的要求。
🐞 按照如上的设置配置完成后，进行构建可能出现如下报错
出现问题的原因：可能是CloudFlare升级环境导致不兼容
解决方法：降级为旧版构建环境，再点击重试
2️⃣ 添加自定义域名
在本次测试时，恰好使用的DNS服务商是Cloudflare，所以填写完成自定义域后，会在对应的DNS解析自动加上CNAME记录。假设你的DNS服务商不是Cloudflare，那就按照文档的要求在自己的DNS服务商中加入一条CNAME记录。
部署效果预览
3️⃣ 定时部署
虽然Cloudflare会根据Git的push更新而帮助我们自动更新代码，但是由于Cloudflare是静态部署，所以在Notion更新的内容只能在重新打包的时候更新到CF上，所以我们希望有一个程序帮我们定时更新代码以便获取尽量新的博客。
恰好CF给我们提供了部署挂钩，它可以通过我们对CF服务器发送网络请求就能触发对应项目Pages的更新。
部署挂钩：使用唯一 URL 自动从无外设 CMS 或另一个服务触发分支部署
申请完成后，我们可以得到以下数据。根据官方文档提供的方法，我们可以使用Contentful、Ghost等等CMS platforms发送Web Hooks，具体参考官方文档：
但是部分CMS平台需要付费或者没有定时触发功能，我们决定改用Jenkins实现定时触发Web hooks（在服务器安装Jenkins请参考 ）
主要设置一下两步：
1️⃣ 「构建触发器」-「定时构建」，填入
30,0 0,8-23 * * *。（每天早上从8:00起到凌晨12:30，每半个小时执行一次）
2️⃣ 「Build Steps」加入以下代码
（六）总结
亲测以上五种方法之后，得出一个推荐排名🤩
类型 | 推介指数 | 理由 |
VPS | 🌕🌕🌕🌕🌗 | 如果有Liunx基础和服务器，那这款是不二选择。但如果零经验，折腾服务器可能需要不少的时间噢~ |
Vercel | 🌕🌕🌕🌕🌑 | 如果你有域名，然后配置记录访问Vercel的中国站点，访问速度也是很快的；但是没有域名，该方案也许行不通。就是比较极端啦（Vercel被和谐了） |
Netlify | 🌕🌕🌕🌑🌑 | 跟Vercel相比，能直接访问但是速度较慢；如果使用自定义域名，速度好像不是提升很大… 如果你没有自己的域名那建议选Netlify |
4everland | 🌕🌕🌕🌑🌑 | 如果选用静态部署（加载速度方面是优势）方案，建议CloudFlarePage |
CloudFlarePage | 🌕🌕🌕🌕🌗 | 如果文章篇幅过长，需要快速加载，静态部署方案的首选 |
可能你留意到了还有一种部署方法——Zeabur没有被提及，原因是Zeabur是付费的云服务部署方案。我认为你应该能在上述的五种方案中找到符合自己需求的方案，所以在此不详细介绍Zeabur，如果你感兴趣你可以去NotionNext文档查看详细的Zeabur部署方法，以下附一张Zeabur的定价方案。
三、Blog核心配置
以下是关键数据的配置：
1️⃣ 首先需要通过
page-id 配置数据源。⚠️ 但是需要注意，Blog数据库 page-id 必须在代码层面进行配置，如blog.config.js文件、.env.local文件或者是运行时的环境变量中进行设置。2️⃣ 其他设置（具体设置详见blog.config.js文件）在『配置中心』中进行通过键值对进行设置，设置完记得勾选「启用」，该页面中配置的属性生效优先级最高。
以下是博客书写和观感建议：
这点也是最重要的，为了方便我们在Notion中书写和在Notion Next博客中展示，以下是实践后的建议：
1️⃣ 每一节之后最好空一行
2️⃣ 防止过多的内容在Notion中编辑会出现卡顿的现象，可以将Notion中编写内容时最小层级的「标题」转化为「折叠标题」，在编辑时候时候展开，编辑完成可将其折叠。因为其在NotionNext博客中的初始状态是折叠状态，我们可以在NotionNext的配置项 中加入以下代码，实现打开页面时所有折叠块展开（该步骤已经在我的NotionNext代码中集成，通过配置项
GLOBAL_JSTOGGLE_EXPAND 进行控制）参考官方文档
- 作者:😈Zabanya
- 链接:https://blog.zabanya.space//article/b3be3366-025a-422e-89b9-0b0ad804b6d6
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处