How to deploy react on linux

How to deploy react on Linux: 1. Open the configuration file; 2. Package the client and server through the "tar -zcvf client.tar.gz client" command; 3. Pack "client.tar.gz ”, “server.tar.gz”, “theme.js” and “package.json” files are copied to the project folder on the server; 4. Start the service.

The operating environment of this tutorial: linux7.3 system, react18.0.0 version, Dell G3 computer.

How to deploy react on linux?

Deploy the web front-end react project to the linux server

The directory structure of the project

 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 ```

1. Edit the configuration file

Modify the file

 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

2. Package the program

In the project root path

npm run build

Client appears

Package client and server

tar -zcvf client.tar.gz client
tar -zcvf server.tar.gz server

3. Upload and start

Pack client.tar.gz, server.tar. Copy the four files gz, theme.js, and package.json to the project folder on the server

Enter the project directory and start the service

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

In this way, the project is deployed to the server

Recommended learning: "react video tutorial"

The above is the detailed content of How to deploy react on linux. For more information, please follow other related articles on the PHP Chinese website!