时间:2021-05-19
今天要用到服务器nginx,还需要把自己的vue的项目部署到服务器上去所以就写一下记录下来。
首先要去nginx官网下下载nginx:
下载地址:https://nginx.org/en/download.html
下载下来会是一个解压包,解压到你想放的文件夹下
运行nginx.exe,然后打开浏览器输入localhost出来如下图片所示就说明成功了:
然后如果没有成功出来的话也不要慌不要怕,可能是你的端口被别的内容所占了这时你就打开你的nginx的目录下找到conf
点击进去然后找到一个nginx.conf的文件
然后把它用编辑器的方式打开,打开之后找到这里的sever的listen就是你的端口号,默认的是80端口,你可以根据自己没有被占用的端口进行改写,改写完成之后保存然后打开你的localhost:你改写的端口号就OK了
server { listen 8088; server_name localhost; #charset koi8-r; #access_log logs/host.access.log main; location / { root html; index index.html index.htm; }上面是安装配置nginx服务器的方法,下面就是如何把自己的vue项目部署到你所安装配置的nginx服务器上的步骤了:
首先找到自己的vue的项目然后输入命令 npm run build 他会在你的vue目录下生成一个dist文件夹里面就是你的vue的项目
然后打开这个dist文件夹把里面的内容复制下来里面会有两个文件一个是index.html是主目录还有一个是static文件夹
把他们复制下来然后打开你的nginx的目录下的html文件里面会有两个默认文件直接删掉不要留,然后把你刚刚复制的文件粘贴进去
然后打开浏览器输入最开始改的端口号localhost:你所改的端口号回车;你就会看到自己的vue的项目跑起来了我的打开就是这样的咯:
这样就大功告成了~~~~~
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
前言今天把自己写的demo登录写完了,就想着试着走一下部署上线的流程。参考了很多的文档,终于成功进行了部署。在这里将服务器的搭建和vue项目的部署上线进行整理(
上一篇博文写了weblogic部署项目的三种方式,包含在控制台中安装部署,将部署包放在domain域中autodeploy目录下部署,使用域中配置文件confi
分享IIS环境下部署项目的详细教程1.环境部署1.1安装IIS7进入控制面板,选择“程序和功能”,进入如下页面后,点击“TurnWindowsfeatureso
本教程主要讲解的是Vue-CLI3.x脚手架搭建的vue项目,先构建生成dist文件(纯静态应用),然后自动化部署到静态文件服务器Nginx。一、Nginx服务
nginx大家如果没用过那或多或少都应该听过,vue的部署、反向代理、负载均衡nginx都能帮你做到。今天主要说一下nginx负载均衡我们的项目,如下图所示,请