项目部署

前期工作

首先可以用服务器新建立一个React项目，步骤如下

npm create-react-app 项目名称
cd 项目名称
npm run build
npm start

下面如果报错，该怎么修理怎么修理。例如：

nodejs版本问题，建议14版本（11版本过低无法运行）

端口3000或其他没有开放，用如下命令开放端口(没有直接npm install xxxxx -g)

sudo ufw allow <端口号>           例如3000

之后还要去阿里云的控制台 ，把端口再手动开放一下。

PM2部署(nohup一直失败)

首先安装pm2

npm install xxxxx -g

下面移动到标准的react项目目录下，执行如下命令：

pm2 start --name agv npm -- start
pm2 list
pm2 delete 项目名字

agv这是启动进程的名字，原博客和效果图如下链接所示

pm2 启动React项目 - 李悠然 - 博客园 (cnblogs.com)

我的成功截图如下：

另外的，有时候项目渲染的时间较长，如果看到title有变化，那就可以提前庆祝了

Nginx反向代理

首先，把你的域名解析到对应的服务器。（一般情况是，同一平台内的服务器对应多个域名）

解析实例如下：

我们解析的时候，@和www都要解析一次。这样浏览器输入和不输入www都可以访问到我们的网站。

之后用Nginx反向代理，把IP+端口和域名对应起来。其实，IP+端口可以访问到已经成功一大半了，Nginx反向代理的工作还是相对轻松的，代码如下（把他加在server层里面）：

    server {listen 80;server_name www.hengmengkeji.cn;proxy_ignore_client_abort on;
location / {proxy_pass http://127.0.0.1:3000/;proxy_read_timeout 3200;proxy_redirect off;proxy_set_header Host $host;proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;}
}

listen 80 是因为我们每次访问域名都是默认的80端口
server_name 是我们解析到服务器的域名
proxy_pass 后填写我们要代理的IP+

这样，我们就可以通过域名访问到自己的React项目啦！

我的成功截图（最终版）

祝你成功！

PM2部署React项目(Ubuntu服务器)相关推荐

react项目服务器Tomcat,tomcat部署react项目的方法
tomcat部署react项目的方法发布时间:2020-12-16 09:44:42 来源:亿速云阅读:151 作者:小新这篇文章主要介绍了tomcat部署react项目的方法,具有一定借鉴价值 ...
nginx location匹配除了一个路径_nginx部署React项目
nignx是一款非常优秀的服务器软件,前端工程师在开发完项目后,通常要将项目部署到服务器,我在部署项目时用的就是nginx.今天跟大家分享一下用nginx部署前端项目的一些经验.React项目开发完成 ...
PM2 部署 nodejs 项目
PM2 部署 nodejs 项目在网上找到pm2.目前似乎最常见的线上部署nodejs项目的有forever,pm2这两种. 使用场合: forever管理多个站点,每个站点访问量不大,不需要监控. ...
使用pm2部署nuxt3项目
众所周知,nuxt3.js是基于vue开发ssr,seo的项目比较好的框架,那么开发完成项目,如何部署nuxt项目也是比较重要的,接下来就记录一下我在开发中是如何部署的. 这篇文章只是对配置环境变量做 ...
通过Maven插件wagon-maven-plugin实现快速部署SpringBoot项目至服务器
通过Maven插件wagon-maven-plugin实现快速部署SpringBoot项目至服务器一.wagon-maven-plugin概述二.代码实例 2.1 配置 Linux 服务器用户名和 ...
linux服务器部署react项目步骤详解
一.安装node环境下载软件包 wget https://nodejs.org/dist/v11.10.0/node-v11.10.0-linux-x64.tar.gz 解压 tar ...
发布react项目到linux服务器,nginx上部署react项目的实例方法
测试项目:react-demo 克隆你的react-demo项目到服务器上(默认使用Github管理我们的项目) 如果需要,请安装项目环境,比如:node.js,yarn等进入项目目录,执行npm ...
部署nodejs项目到服务器的一些总结
安装nodejs 首先在服务器上安装nodejs并配置环境,这个可以参考官方的文档,就不细说了拷贝项目到服务器上这里其实可以通过git直接clone在服务器上.当然正常发版一般是将代码打包上传到服 ...
Windows下的Nginx部署React项目及解决反向代理跨域问题等-20.8.1更新
文章目录 1. 概述 2. 优点 3. 为什么选择Nginx 4. 下载 5. 安装 6. 配置参数详细说明 7. 命令行参数 7.1 启动nginx 7.2 重启nginx--重新加载配置 7.3 ...
【阿里云 Linux 服务器】购买 Linux 到项目部署过程中遇到的问题，部署 SpringBoot 项目到服务器上，在手机上安装 Android 程序进行测试
文章目录一.购买好服务器之后要重置密码二.利用 putty 程序登录访问你的服务器三.配置安全组开放端口四.部署项目前期准备工作 4.1 安装 Java 4.2 安装 mysql 4.3 安装 ...

PM2部署React项目(Ubuntu服务器)

项目部署

前期工作

PM2部署(nohup一直失败)

Nginx反向代理

PM2部署React项目(Ubuntu服务器)相关推荐

最新文章

热门文章