项目最后的项目部署,打包流程

发布于 2022-08-01  68 次阅读


 (扩展小知识: 每次打开前端文件运行和后端文件运行的时候都需要在cmd里一步一步输入命令比较的麻烦,我们可以创建一个后缀名问 " .bat "的文件把步骤写进这个文件里,只需每次运行的时候直接点击该文件就可以了。(" .sh "文件也是 但里面的反斜杠改成正斜杠就可以))

下面是我们的正题打包流程

用到了nginx

简单介绍一下,nginx这是一个轻简级的wed服务器 这里简单可以了解一下,需要深入的了解的话可以自行的深入了解

一..nginx: downloadhttps://nginx.org/en/download.html

 在上面这个链接中下载nginx ,如果是下载的压缩包的话先把这个压缩包拖进c盘除外的其他盘在进行解压(解压之后看见.exe千万千万千万不要点,它不是在这个里面运行的,是在cmd命令里运行的

二.在解压好的nginx当前目录运行cmd   运行命令是  start nginx

检测是否启动成功1.在任务管理器中查看是否有这个nginx.exe的文件在运行,有的话是成功了

                              2.在地址栏中输入localhost:80

出现该页面就是开启成功了​编辑

 如果打不开就是遇到问题了,以我的认知只知道浅浅的一些问题问题的方法

第一种问题:可能就是80端口被占用了,在nginx-1.20.2=>conf=>nginx.conf这个文件里面把端口号改一下就可以,然后再cmd里输入nginx -t这个命令查询一下语法有没有问题,然后用nginx -s reload命令重新启动一下,再次输入start nginx 命令重新运行起来就可以。

第二种问题:原来装了phystudy软件类似的软件,里面自动优先开启了apache服务器,在phpstudy软件上关了apache,开启了nginx服务器,解决了这个问题

还有其他的问题需要你们去探索了目前我只遇到以上两个问题的解决方法


三.项目打包

相关命令:  

start nginx  启动服务器
nginx -s stop   快速停止服务器
nginx -t -c D:\....  (后面跟的是完整路径的地址)    这个是语法检测

 1.在需要打包的目录cmd 输入 npm run build 出现dist这个文件的就是就可以了

2.在nginx.conf文件中在复制一个server的代码 修改一下端口号(端口不能跟上面的server里的一样,一样的话会导致冲突),root  那里修改完整的打包的dist文件根路径地址,其他都不用改,然后再nginx的cmd输入nginx -s reload命令重新加载一下  之后就可以用端口号登录了

3.(进入成功之后有个bug就是不能刷新,一刷新之后就会变成404)

处理方法:都加上​编辑

 在每个修改之后在nginx的cmd 以此的输入以下的命令

nginx -s stop    暂停运行
nginx -t -c G:\......   检测该nginx.conf的语法是否有误
start nginx   启动服务器
nginx -s reload    重新加载

然后正常的使用端口号或者本地IP地址进入网站即可

以上整理的不是很全,有错误的地方希望可以指出,谢谢 ​