将React应用程序部署到Github用户页面

时间:2017-09-25 23:26:43

标签: reactjs github-pages create-react-app

我在将React应用程序部署到我的Github用户页面时遇到了一些麻烦。我已经阅读了create-react-app文档并了解如何使用“yarn run deploy”部署到项目页面,但是,这不是我想要做的。

我认为问题是 user 页面在repo的根目录中查找index.html,但是“npm run build”在单独的构建目录中生成该文件。由于必须从主分支构建用户页面,因此我正在寻找一种方法,以便在repo的根目录下生成这些构建文件。我的第一个想法是修改“build.js”脚本,但是当我打开它时,我不确定我在看什么。

对于它的价值,当我在推送到Github之前将构建目录的内容直接拖到根目录中时,应用程序工作正常,并且可以按照用户名进行访问.githubo.io。然而,这感觉相当草率和乏味。

我已经尝试将package.json中的“homepage”设置为“ username .githubo.io /”,但部署脚本仍会生成一个单独的gh-pages分支,应用程序从该分支开始建立(再次,不允许用户页面)。

提前感谢您的帮助!如果我能澄清,请告诉我。

编辑:

https://tyler-coleman.github.io/

https://github.com/tyler-coleman/tyler-coleman.github.io

包括当前网站和回购的链接,所以你们都知道我在说什么。现在我已经解决了这个问题,包括“cp -a build /。”。在我在package.json中的部署脚本中。

我认为文档包含部署到项目页面的说明,而不是用户页面的说明,这很奇怪。

2 个答案:

答案 0 :(得分:2)

它运行正常,因为您的localhost计算机正在运行节点和节点包管理器 - github页面不运行node.js,这是您的实例需要提供服务的反应。

如果你想运行react和节点,我建议每月花5美元租一个linode linux盒子并安装你需要的东西。每年额外12美元,您可以注册自己的花哨域名..

答案 1 :(得分:0)

我在Github用户页面here上找到了一个很好的关于如何部署React的教程。

基本上,您必须将React源添加到另一个分支(通常为dev),然后在package.json中预先存在的“ scripts”对象中设置以下内容:

"predeploy": "npm run build",
"deploy": "gh-pages -b master -d build",

这告诉gh-pages在主分支上部署React App。

除此之外,您还必须在对象的最高级别添加“主页”:

"homepage": "https://yourgithubusername.github.io",

dev设置为存储库的默认分支也是一个好主意。

有关更多详细信息,请参见上面的链接。