React部署到linux服务器怎样做-群英

上一篇：实现所有async函数添加try/catch的方法是什么下一篇：React实现tab组件的详细过程及代码是什么

今天我们来学习关于“React部署到linux服务器怎样做”的内容，下文有详解方法和实例，内容详细，逻辑清晰，有需要的朋友可以参考，希望大家阅读完这篇文章后能有所收获，那么下面就一起来了解一下吧。

本教程操作环境：linux7.3系统、react18.0.0版、Dell G3电脑。

react怎么在linux上部署？

部署web前端的react项目到linux服务器

项目的目录结构

 1 ```
 2 ├─dlls                          #dlls编译后的问题
 3 ├─doc                           #帮助文件入口
 4 │
 5 ├─src
 6 │ ├─apps                        #各个功能模块放在这里
 7 │ │  ├─aftersale                #售后模块
 8 │ │  │  └─contractmanage        #合同管理
 9 │ │  │      └─component
10 │ │  ├─login
11 │ │  ├─sales
12 │ │  |   ├─housequery
13 │ │  |   └─reservation
14 │ |  ├─action.js                #主界面可发起动作
15 │ |  ├─index.js                 #主界面视图，已连接redux
16 │ |  └─reducer.js               #主界面动作处理器
17 │ ├─common                      #公共资源文件夹，包含功能样式图片等
18 │ │  └─img
19 │ │      ├─funButton
20 │ │      └─icons
21 │ ├─components                  #可复用视图组件，与具体业务无强关联
22 │ │  ├─Common
23 │ │  ├─Footer
24 │ │  ├─LeftPanel                #左侧菜单
25 │ │  ├─Loding
26 │ │  ├─NavPath                  #面包屑
27 │ │  ├─PanelBox
28 │ │  ├─RightPanel               #右侧主视图区
29 │ │  └─TabPanel
30 │ ├─constants                   #公用静态数据
31 │ |  └─LeftMenu                 #主菜单结构定义(新增模块时在这里增加菜单)
32 │ ├─entries                     #系统主入口文件
33 │ ├─reducers                    #系统动作处理器注册模块(增加新模块需配合在这里增加动作处理器)
34 │ ├─routes                      #系统路由动态生成模块(根据apps下的模块结构)
35 │ ├─store                       #系统全局状态存储器(一般不会修改)
36 │ │  └─middlewares
37 │ └─util                        #工具类包(xFetch后台请求工具等)
38 │
39 ├─static                        #静态资源存放路径                      
40 ```
 登录后复制

一.编辑配置文件

修改该文件

 projectName\server\config\environment\common.js

process.env.NODE_ENV = 'development'
SERVER_IP: process.env.IP || '服务器ip'
SERVER_PORT: process.env.PORT || 8001, //8001, 9092
 登录后复制

二.打包程序

在项目根路径下

npm run build
 登录后复制

出现client

将client和server打包

tar -zcvf client.tar.gz client
tar -zcvf server.tar.gz server
 登录后复制

三.上传和启动

将client.tar.gz，server.tar.gz，theme.js，package.json这四个文件拷贝至服务器上的项目文件夹下面

进入项目目录，开启服务

cnpm install
pm2 start server/app.js
/*
也可以使用pm2 -h 或 pm2 --help 来查看帮助命令
*/
 登录后复制

就这样，项目被部署到服务器上了

现在大家对于React部署到linux服务器怎样做的内容应该都有一定的认识了吧，希望这篇能对大家有所帮助。最后，想要了解更多，欢迎关注群英网络，群英网络将为大家推送更多相关的文章。

标签： React部署

免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。

上一篇：实现所有async函数添加try/catch的方法是什么下一篇：React实现tab组件的详细过程及代码是什么