如何在静态服务器上部署React应用程序

Question

我有一个带有create-react-app的react应用程序构建。它使用octoberCMS作为后端，并使用来自前端的Axios调用来获取数据。到现在为止，我一直在将octo的构建内容保留在octoberCMS安装的根目录下的名为“ react”的目录中。因此，我点击的网址是http://example.com/react/。

问题现在已经解决了开发阶段，并期待部署。但是我希望我的前端在http://example.com服务，而后端在http://example.com/backend服务（后端按我的意愿服务）。我该如何实现？我对这两个框架都很陌生。

我尝试将构建内容与octoberCMS的其余部分一起保存

Answer 1

首先构建您的React应用，它将为您提供vendor.js [第三方脚本]和您的app.js [您的实际应用]

将它们放入主题目录assets

然后在Ocotber CMS中使用URL /:url?制作页面并将您的index.html内容粘贴到此处。 将是您的root div和including js html，更改js的路径，该路径指向您放置在主题目录中的build js。

现在当有人来到现场时会发生什么 -我们提供的内容与开发版本中的内容相同 -具有根标签和所需js的index.html

现在，如果使用命中任何其他网址（如https://www.example.com/test/etc），它也会被/:url?（以及所有其他请求）捕获，并提供首页，并且我们的react应用将按需运行。

如有任何疑问，请发表评论。