使用Github pages,Vercel免费部署一个自己的网站

734 阅读1分钟

Github pages部署

  1. 创建一个GitHub仓库:首先,您需要在GitHub上创建一个新的仓库,或者使用现有的仓库。
  2. 将您的网站文件添加到仓库:将您的网站文件(HTML、CSS、JavaScript等)添加到仓库的根目录或指定的分支中。
  3. 配置GitHub Pages:在仓库的设置中,找到“Pages”部分,然后选择您的部署源(通常是main分支或gh-pages分支)。

image.png

  1. 等待部署完成:GitHub将自动构建和部署您的网站。这可能需要几分钟时间。
  2. 部署完成后,您可以通过https://[您的GitHub用户名].github.io/[您的仓库名]访问您的网站。

image.png 请注意,GitHub Pages仅支持静态网站。如果您的网站需要服务器端处理,您可能需要考虑其他托管选项,如Vercel、Netlify或Heroku。

Vercel部署

  1. 选择一个需要构建的git仓库

image.png

  1. 配置项目 测试项目是一个Next.js项目,所以Framework Preset选择了Next.js,其他的就保持默认

image.png 点击“部署(Deploy)”按钮。

  1. 重新部署项目/查看部署报错信息
  • 点击右上角用户头像,点击弹框里面的“Dashboard”,进入到Vercel的仪表盘主页。
  • 选择项目,在Vercel的仪表板中,选择您想要重新部署的项目。
  • 部署失败,下面会有报错信息

image.png

  • 在部署页面的Source标签下,可以查看源代码

image.png 4. 访问您的网站:部署成功后,您可以通过Vercel提供的域名访问您的网站。 Vercel.app在国内遭到DNS污染,导致无法访问,

image.png 5. 配置自定义域名解决*.vercel.app无法访问的问题

image.png