技术栈：react + umi。
背景：当我们在本地写好一个react项目时，这个项目可以在本地正常运行预览了，但是我们还需得让其他人也访问这个网站，这个时候就要配置nginx了，需要一台服务器，然后我们在服务器里面设置一块空间，并且映射一个域名，这样别人就可以通过这个域名来访问了。
这块知识点侧重于运维，但本文将以前端的视角来讲解，只会介绍一些简单命令及操作流程，便于前端开发者的日常开发。
0 前置
- Linux常用命令大全 blog.csdn.net/tianzongnih…
- Linux vim命令详解 www.cnblogs.com/zhongguiyao…
- Nginx常用配置和使用详解梳理 blog.csdn.net/wu6660563/a…
- Nginx常用命令 www.cnblogs.com/cb118651273…
1 初始准备工作
首先确保我们已经连接了对应的服务器地址，服务器地址的账号密码自行询问管理员。
然后Xshell软件的下载地址可点这里，提取码是：pgb5，直接下载安装即可使用。
确保咱们已经连接上对应的服务器地址：
2 nginx下配置.conf文件
2.1 进入对应.conf文件的所在目录（问后端或运维），然后复制一个新的.conf文件，用于放置我们打包后的前端代码。
2.2 复制一份.conf文件（这里复制的是cloud-manage.conf，如果不晓得复制哪个可问下后端或运维，如果没有这个文件，我理解需自行新建一个再编辑）。
2.3 然后再对这个.conf文件里面的内容进行编辑 。
（1）打开这个文件
（2）根据需求更改(不明白问下后端或运维)，我这里只改了画框的那部分。
然后按
esc键，接着在哪shift+:，输入wq!（强制保存并退出的意思），回车。这里说个小细节：当我们输入文件名，可先只打开头一两个字母，然后按
Tab键会自动补全。
（3）cat 文件名 查看我们刚刚编辑的文件
ok，看来刚刚保存成功了，继续下面的操作。
（4）重启一下nginx
3 配置dns
（1）进入要配置dns的那个文件目录（具体目录可问后端或运维），进行编辑，配置dns
（2）我在这里添加了一个我的项目对应的域名，然后按esc键，接着在哪shift+: ，输入wq! （强制保存并退出的意思），回车保存退出。
之后依然可以按cat + 这个文件名查看是否添加正确。
（3）进入这个目录reload热启动一下
（至于你要进哪个目录，可问后端或运维，我这里进的是这个目录）
4 把打包的前端文件上传到对应的地址目录下，访问即可。
这里我用FileZilla软件手动在这个位置建了个目录，然后我们把前端打包的dist文件夹里面所有内容直接拖拽到里面，然后我们就可以通过域名来访问啦。
注：由于我们配置的端口不同，当我们访问域名浏览器依然显示无法访问，可通过http来试试，不要用https。
5 发布效果展示
到此，前端对于nginx相关的配置及发包流程已经完毕，我们可以通过刚刚配置的链接（dev.zhongtie.advertisement-manage）访问（需连接无锡vpn）。
线上访问效果：
