logo标签列表

如何在AWS EC2上部署create-react-app？

reactjsamazon-ec2
11

我正在使用react-router，因此希望在AWS Ec2上进行托管。如何部署应用程序并使其永久在后台运行，或者如果有其他方式，请告诉我。

4个回答
7
我已经部署了使用react-router-dom的应用程序，它可以正常工作。你可能想在99.9%的Web开发中使用react-router-dom。 - Johnson Samuel
1
请使用亚马逊的S3存储桶上传构建文件夹中的文件并进行测试。如果在S3中仍然无法正常工作，请告诉我，我很乐意帮助你，因为我知道最初部署有多么困难 :D - Johnson Samuel
1
请注意，静态托管包含任何凭据的React网站非常不安全。 - C Bauer
3
OP要求的是EC2，而你回答的是S3，而且这个答案也没有包含太多方便的自动化... - Colin D
@ColinD - 我同意你的观点，这个答案不应该被接受，因为它并不是OP所问的。要在AWS S3上部署React应用程序，可以参考这个链接 - https://medium.com/ovrsea/deploy-automatically-a-react-app-on-amazon-s3-iam-within-minutes-da6cb0096d55 - Sachin Vairagi
显示剩余6条评论
3
在将 React 应用部署到 EC2 后如何使其在后台运行。目前，关闭终端后，无法访问 EC2 的 URL。 - Roster
@Sravani，请不要在你是初学者的情况下使用Ec2，它对于初学者来说太昂贵了，而且有点令人困惑。你可以使用Digital Ocean的droplets轻松构建整个应用程序-https://www.digitalocean.com/community/tutorials/how-to-set-up-a-node-js-application-for-production-on-ubuntu-16-04只需确保您完成链接中提到的所有先决条件即可。现在，至于你的问题，你可以使用pm2在生产模式下永久运行应用程序。步骤1：使用npm install -g pm2安装pm2 步骤2：关闭正在运行的react服务器，使用sudo pm2 start server.js运行应用程序。 - Prav
3

您可以在任何云虚拟机（例如EC2）上构建并部署React.js应用程序，使用自定义端口。

使用它，您可以在同一台机器上部署多个React应用程序。

要部署应用程序，你需要什么？

1. Nodejs
2. PM2js
3. Koa.js
4. Koa-static.js

您只需按照以下步骤进行操作：

  1. 在您的项目中运行此命令npm run build。
  2. 它会在您的项目中创建一个构建文件夹。
  3. 创建该项目文件夹的zip文件，并将其移动到您的VM（ec2）上并解压缩它。
  4. 在您的项目根目录中创建一个Nodejs脚本文件，并将以下脚本粘贴到其中。

文件名：buildStart.js

const httpPort = 80;
const httpsPort = 443;
const koa = require( 'koa' );
const serve = require( 'koa-static' );
const http = require( 'http' );
const https = require( 'https' );
const fs = require( 'fs' );
const app = new koa();
const cert = fs.readFileSync( '/ssl/cert.crt' );
const key = fs.readFileSync( '/ssl/private.key' );

app.use( serve( __dirname + '/build', {
    maxage: 365 * 24 * 60 * 60
} ) );

http.createServer( app.callback() ).listen( httpPort, () => console.log( `sever is listening on ${httpPort}` ) );
https.createServer( { cert, key }, app.callback() ).listen( httpsPort, () => console.log( `sever is listening on ${httpsPort}` ) );

或者

以上代码将在HTTP和HTTPS两种协议下启动你的React应用程序。如果你没有HTTPS证书，那么只能在HTTP协议下启动。

const httpPort = 80;
const httpsPort = 443;
const koa = require( 'koa' );
const serve = require( 'koa-static' );
const http = require( 'http' );
const https = require( 'https' );
const fs = require( 'fs' );
const app = new koa();

app.use( serve( __dirname + '/build', {
    maxage: 365 * 24 * 60 * 60
} ) );

http.createServer( app.callback() ).listen( httpPort, () => console.log( `sever is listening on ${httpPort}` ) );
2

我对React还不太熟悉，但我想在这里分享我的经验。我使用Apache在AWS EC2上部署了我的CRA应用程序。

  • 启动EC2实例后，您可以按照此链接的步骤安装Apache。
  • 构建React应用并上传“build”文件夹。

现在完成了。最后，请确保使用HashRouter而不是BrowserRouter。因为EC2不允许.htaccess文件重定向所有请求到index.html，但将BrowserRouter替换为HashRouter帮助我解决了这个问题。希望这能帮助其他人节省时间。谢谢。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接