✨ 更新日志
🚀 安装部署
✒ 写作指引
🛠 站点配置
📊 网站统计
⭐ 主题配置
📩 评论插件
🧷 外部插件
🔊 站点订阅
⌨ 开发指引
👨👦👦 联系方式
🤝 购买服务
Vercel部署多个Github网站
category
tags
type
status
slug
date
password
Last edited time
Apr 28, 2024 10:17 AM
summary
icon
如果部署一个网站没能满足您的需求,您可以在vercel中重复部署多个网站。除了vercel,其他的Netlify、CloudFLare等等也可以用类似的方法部署多个。
部署原理
在开始部署多个网站前,需要简单了解一下vercel部署站点的原理,github上的项目、
Vercel导入Github项目
Vercel可以部署多个项目,您可以通过将Github仓库导入Vercel,或者通过别的方式上传代码。![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F6c096b44-beb9-48ee-8f92-1efdde47f3a3%2Fcf75837f-eaee-4aff-a580-d36a180b86f0%2FUntitled.png?table=block&id=ecc2b323-83e1-41c7-a155-82138f52ce5b&t=ecc2b323-83e1-41c7-a155-82138f52ce5b&width=1684&cache=v2)
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F6c096b44-beb9-48ee-8f92-1efdde47f3a3%2Fcf75837f-eaee-4aff-a580-d36a180b86f0%2FUntitled.png?table=block&id=ecc2b323-83e1-41c7-a155-82138f52ce5b&t=ecc2b323-83e1-41c7-a155-82138f52ce5b&width=1684&cache=v2)
Vercel 监听github代码自动部署
如果您的项目是通过Github连接并导入,则Vercel会自动关联监听仓库中代码,一旦Github中的代码发生修改就会重新部署您的站点。
Vercel 断开Github链接
在项目中可以通过disconnect,断开和github仓库的链接,这样就不会实时监听代码的修改,此时您在Notion中的修改的文章和配置还是会被实时读取到。
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F6c096b44-beb9-48ee-8f92-1efdde47f3a3%2F4cd955af-57b4-467d-9f03-4843ee7254fb%2FUntitled.png?table=block&id=1085aac3-996d-4e78-9813-ac2736358a23&t=1085aac3-996d-4e78-9813-ac2736358a23&width=1631&cache=v2)
Vercel重新将项目与Github关联
断开链接的vercel项目,或者从未关联过的项目,可以在这里手动链接,
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F6c096b44-beb9-48ee-8f92-1efdde47f3a3%2Fb5d6645c-20b4-4b09-96ff-18a6469b3185%2FUntitled.png?table=block&id=568d47b3-2480-4913-9abb-04b00d766ed6&t=568d47b3-2480-4913-9abb-04b00d766ed6&width=1454&cache=v2)
链接Github后可以指定监听的分支,例如main分支。
链接后,只要随意修改一下对应分支的代码,vercel就会尝试自动拉取代码并安装部署。
Vercel与Github的链接关系
- Vercel项目连接Github仓库是有限制的
同一个Github仓库只能被Vercel中的最多3个项目链接。超过则不被允许。
- Vercel 后台可以指定当前项目绑定的是Github仓库中的哪个分支
Github仓库是可以建立无数个分支的,每个分支的代码完全独立,您可以将每个分支用来规划城不同的网站。
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F6c096b44-beb9-48ee-8f92-1efdde47f3a3%2F23d4100a-7f9f-4c6e-b269-2d175b964af5%2FUntitled.png?table=block&id=354d1172-a951-41fc-be24-f55f8e7b5fac&t=354d1172-a951-41fc-be24-f55f8e7b5fac&width=1667&cache=v2)
如何部署多个NotionNext站点
了解了以上特性我们就可以尝试部署多个站点。
Github的分支管理
您可以在Github中的NotionNext项目中,创建多个分支,几个分支就是几个网站。![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F6c096b44-beb9-48ee-8f92-1efdde47f3a3%2F3174654d-2c70-469a-ad8b-a883fa6fc805%2FUntitled.png?table=block&id=5926b74a-4e54-4c2c-899a-47d72404eac2&t=5926b74a-4e54-4c2c-899a-47d72404eac2&width=1046&cache=v2)
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F6c096b44-beb9-48ee-8f92-1efdde47f3a3%2F64d65a3b-af43-46d9-a643-f87834ae48e2%2FUntitled.png?table=block&id=613db3a2-b058-47d4-8a95-3d295bb3d1a6&t=613db3a2-b058-47d4-8a95-3d295bb3d1a6&width=1105&cache=v2)
点击左上角的分支名,并打开View all branches ,这里可以管理你的所有分支
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F6c096b44-beb9-48ee-8f92-1efdde47f3a3%2F3174654d-2c70-469a-ad8b-a883fa6fc805%2FUntitled.png?table=block&id=5926b74a-4e54-4c2c-899a-47d72404eac2&t=5926b74a-4e54-4c2c-899a-47d72404eac2&width=1046&cache=v2)
点击new branch 创建新分支![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F6c096b44-beb9-48ee-8f92-1efdde47f3a3%2Fbf2cfd55-3f44-4110-b964-75bd590c912c%2FUntitled.png?table=block&id=ed7d52d7-ab61-488d-a89f-80a458e58f8a&t=ed7d52d7-ab61-488d-a89f-80a458e58f8a&width=1686&cache=v2)
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F6c096b44-beb9-48ee-8f92-1efdde47f3a3%2Fbf2cfd55-3f44-4110-b964-75bd590c912c%2FUntitled.png?table=block&id=ed7d52d7-ab61-488d-a89f-80a458e58f8a&t=ed7d52d7-ab61-488d-a89f-80a458e58f8a&width=1686&cache=v2)
例如,我创建了 deploy/tangly1024.com这个分支专门用来部署我的网页
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F6c096b44-beb9-48ee-8f92-1efdde47f3a3%2F64d65a3b-af43-46d9-a643-f87834ae48e2%2FUntitled.png?table=block&id=613db3a2-b058-47d4-8a95-3d295bb3d1a6&t=613db3a2-b058-47d4-8a95-3d295bb3d1a6&width=1105&cache=v2)
要修改这个分支代码,只要在左上角切换到此分支即可。
创建多个分支不是必须步骤,例如我部署的多个项目绑定的都是同一个分支,只是在vercel中通过不同项目的环境变量即可修改网站内容,或者直接在notion_config中修改站点信息即可。
Vercel的多项目管理
vercel面板首页点击添加新项目
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F6c096b44-beb9-48ee-8f92-1efdde47f3a3%2Fd418ab6c-082f-4c46-b9b4-0aa005a52662%2FUntitled.png?table=block&id=3b9805b0-336b-4dbe-90f0-8bab39a0b158&t=3b9805b0-336b-4dbe-90f0-8bab39a0b158&width=551&cache=v2)
选择导入NotionNext
![notion image](https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F6c096b44-beb9-48ee-8f92-1efdde47f3a3%2F7dcf8473-abf2-430b-914d-dbc1368dc018%2FUntitled.png?table=block&id=239dbf62-3fc8-43c5-b3ed-cdf3307c8c6c&t=239dbf62-3fc8-43c5-b3ed-cdf3307c8c6c&width=968&cache=v2)
这里需要注意,NotionNext这个仓库最多被重复导入3次,如果要导入新的站点,请将已存在的项目断开Github链接,取消链接的方法已在上文指出。
导入项目后注意给这个项目配置Notion_Page_ID
最后
还有什么疑问欢迎在评论区留言。
Loading...
Last update: 2024-02-27