React前端服务部署基本过程(Nginx篇)

React 前端服务部署过程(Nginx 篇)

  1. 服务器安装 node,nginx,并全局命令调用实现;参考链接:
    Linux 版本环境安装及 Web 部署
    Windows 版本环境安装及 Web 部署

  2. 安装好之后,开始配置并部署服务:

  • 前端项目npm run build(项目脚手架:create-react-app),生成build静态资源包;

  • 将静态资源包部署(拖拽)到服务器上,开始配置 nginx,启动服务;

    以我们服务器 Linux 配置为例,参考 nginx 配置

    worker_processes  1;
    events {
      worker_connections  1024;
    }
    http {
      include mime.types;
      default_type application/octet-stream;
    
      #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
      #                  '$status $body_bytes_sent "$http_referer"
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
前端打包部署服务器的大体流程如下: 1. 部署前的准备:准备要部署的项目和阿里云服务器。确保服务器操作系统是 CentOS,推荐选择7.5或7.6版本。 2. 打包项目:将前端项目进行打包,生成静态文件。 3. 连接阿里云服务器:使用本地工具连接到阿里云服务器。 4. 安装必要的软件:在服务器上安装epel仓库和nginx。epel仓库是为了方便安装一些额外的软件包,而nginx是用来作为前端项目的服务器。 5. 配置nginx:启动nginx,并检查端口号的配置。如果需要访问默认端口号80,可以在nginx配置文件中进行相应的配置。 6. 上传文件到服务器:将打包好的静态文件上传到服务器上。 7. 配置域名和访问:根据需要,可以配置域名解析,让用户可以通过域名来访问项目。 总结起来,前端打包部署服务器的流程包括准备工作、打包项目、连接服务器、安装软件、配置服务器、上传文件和配置域名。这样就可以将前端项目部署到阿里云服务器上,让用户可以通过域名或公网IP来访问项目。\[1\]\[2\]\[3\] #### 引用[.reference_title] - *1* *2* *3* [vue/react/web前端项目部署到阿里云服务器_nginx_pm2流程及部署前的准备](https://blog.csdn.net/Charissa2017/article/details/105886521)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值