服务器安装 node,nginx,并全局命令调用实现;参考链接: Linux 版本环境安装及 Web 部署 Windows 版本环境安装及 Web 部署
安装好之后,开始配置并部署服务:
前端项目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" ' # '"$http_user_agent" "$http_x_forwarded_for"'; #access_log logs/access.log main; sendfile on; #tcp_nopush on; #keepalive_timeout 0; keepalive_timeout 65; client_max_body_size 512m; upstream bora_pool { server 127.0.0.1:5000 fail_timeout=0; } gzip on; server { listen 8080; server_name localhost; location /report.html { alias D:/software/MES/nginx-1.14.2/html/report.html; } #error_page 404 /404.html; # redirect server error pages to the static page /50x.html # error_page 500 502 503 504 /50x.html; location = /50x.html { root html; } location ~ \.php$ { root html; fastcgi_pass 127.0.0.1:9000; fastcgi_index index.php; fastcgi_param SCRIPT_FILENAME D:/scheduleJar/front/build/html$fastcgi_script_name; include fastcgi_params; } } server { listen 5000; server_name 127.0.0.1; root D:\MES\front\build; index index.html; location / { try_files $uri $uri/ @router; index index.html index.htm index.php; 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; } location @router { rewrite ^.*$ /index.html last; } location /attendance { proxy_pass http://127.0.0.1:5555; } } }