reactjs - 将 React 应用程序部署到自定义域名

Question

我有一个react app和一个我通过 Namecheap 注册的域名。如何将应用程序部署到我的域名？

我知道诸如 Heroku 之类的 PaaS。我可以将它部署到 Heroku，然后使用 Heroku 的自定义域功能将其指向我的 url，但是免费的 Heroku 实例处于休眠状态，我不想在没有确认所有可能性的情况下投资 Heroku 的付费服务器。

我想避免我的域名被修改，并在托管成本、易用性和速度之间取得适当的平衡。部署超出了我迄今为止学到的大多数东西的范围，所以很想看到这些选项。

干杯!

Answer 1

看起来您的 React 应用程序是一个单页应用程序。在您的 Heroku 服务器中，将您的服务器设置为服务器 index.html，无论它接收什么 URL。然后你的 React Router 会根据 URL 知道要提供哪些内容。希望它能给你一个想法。

Answer 2

由于您的项目托管在 GitHub 上，因此您可以将 GitHub 页面与您的域一起使用

按照以下步骤从 - https://dev.to/yuribenjamin/how-to-deploy-react-app-in-github-pages-2a1f

将属性添加到 package.json 文件。

我们需要在顶级主页添加的第一个属性第二个我们将其定义为字符串，值将是“http://{username}.github.io/{repo-name}”{username} 是您的 GitHub用户名，{repo-name} 是您创建的 GitHub 存储库的名称，如下所示：

“主页”：“http://yuribenjamin.github.io/my-app”

其次，在现有的脚本属性中，我们需要添加预部署和部署。

"scripts": { //... "predeploy": "npm run build", "deploy": "gh-pages -d build" }

5- 现在将其部署到 GitHub Pages。只需运行以下命令： npm run deploy

这会将项目部署到 GitHub Pages Now 以配置自定义域，按照此处的文档设置自定义域 https://docs.github.com/en/github/working-with-github-pages/managing-a- custom-domain-for-your-github-pages-site 重要如果您的 A 或 CNAME 记录与您在域提供商站点的项目中使用的记录无关，它可能会扰乱部署，因此如果您遵循步骤并得到错误，删除所有 A 和 CNAME 记录，然后重试