小白从零开始阿里云部署react项目+node服务接口(三:部署到服务器)

服务器 准备工具 依次安装即可
nginx
   安装nginx https://www.runoob.com/linux/nginx-install-setup.html
配置全局nginx命令 https://www.cnblogs.com/NTWang/p/13066602.html
 git
yum -y install git
nvm node版本管理工具
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash
    source ~/.bashrc // 使当前shell读入路径为filepath的shell文件并依次执行文件中的所有语句,通常用于重新执行刚修改的初始化文件,使之立即生效,而不必注销并重新登录

node 下载安装node
   nvm i stable 
// 最新稳定版
   使用nvm安装node之后,直接运行node命令会报错 node: command not found?


forever node的守护进程
 
npm i forever -g // https://www.cnblogs.com/pxjbk/archive/2018/12/24/10169830.html   forever list 正在守护的项目
   forever stop 项目目录  停止守护
   forever start 项目目录 开启守护
 
部署web
npm build 打包项目, 注意:需要再package.json中加入 "homepage": "react_demo"
服务器:

cd /var/www 切换到www下
mkdir react_demo 创建项目目录
打开dos窗口 将本地打包文件 上传到服务器
scp -r C://Users/W10003705/Desktop/其他文件/demo/create_react_app/build/* root@xxx.xxx.xxx.xxx:/var/www/react_demo
配置nginx
打开nginx配置文件编辑:vim /usr/local/webserver/nginx/conf/nginx.conf
下面内容复制放在server里面 ps:可以配置多个站点
# react_demo
location /react_demo {
root /var/www;
index index.html index.htm;
}
运行 服务器地址+react_demo 比如:xxx.xxx.xxx.xxx/react_demo     正常打开说明web部署完成并且成功。      
    果出现页面报404 ,则需要检查nginx配置 ,文件路径
如果是加载资源404,去需要看下资源加载路径,看看hoempage的配置和nginx是否对应

小白从零开始阿里云部署react项目+node服务接口(三:部署到服务器)

部署nodejs
服务器:
cd /var/www
mkdir react_demo_server
找到之前创建的server 不需要上传 node_modules 太大了
  dos :scp -r C://Users/W10003705/Desktop/其他文件/demo/create_react_app/server/* root@149.129.104.166:/var/www/react_demo_server
     服务器:
        1. cd /var/www/react_demo_server // 切换到server文件夹
        2. npm i // 下载依赖
        3. node server.js // 运行
    我的配置的是4000端口,需要在阿里云控制台添加安全组规则     在测试页 点击测试 查看控制台看到返回结果则前后端部署完成
  
  最后使用forever 来守护node进程(如果我们直接用node去运行,当关闭服务器远程链接时,ndoe服务也会关闭)
  forever start /var/www/react_demo_server/server.js
  

小白从零开始阿里云部署react项目+node服务接口(三:部署到服务器)

小白从零开始阿里云部署react项目+node服务接口(一:阿里云服务器)

小白从零开始阿里云部署react项目+node服务接口(二:node服务+web)

上一篇:体验h5离线缓存


下一篇:JavaScript 中 申明变量的方式--let 语句