nginx下部署vue项目

今天要用到服务器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的夹把里面的内容复制下来里面会有两个文件一个是index.html是主目录还有一个是static文件夹

把他们复制下来然后打开你的nginx的录下的html文件里面会有两个默认文件直接删掉不要留,然后把你刚刚复制的文件粘贴进去

然后打开浏览器输入最开始改的端口号localhost:你所改的端口号回车;你就会看到自己的vue的项目跑起来了我的打开就是这样的咯:

nginx下部署vue项目相关推荐

  1. nginx下部署vue项目概览 - (资源篇)

    相关博客: nginx下部署vue项目概览 这里使用的是百度云的服务器,CentOS7系统的 linux服务器用centos还是ubuntu系统_Linux nginx服务器搭建以及配置 nginx部 ...

  2. 在nginx上部署vue项目(history模式);

    在nginx上部署vue项目(history模式): vue-router 默认是hash模式,使用url的hash来模拟一个完整的url,当url改变的时候,页面不会重新加载.但是如果我们不想has ...

  3. 在nginx上部署vue项目(history模式)--demo实列;

    转载地址:https://www.cnblogs.com/573734817pc/p/11057677.html 在很早之前,我写了一篇 关于 在nginx上部署vue项目(history模式) 但是 ...

  4. 小试牛刀:百度LS轻量服务器+Centos7.9+PuTTY+Nginx,部署Vue项目

    简单将vue项目部署到云服务器上 百度LS轻量服务器 PuTTy 远程登录 防火墙配置与开放端口 Ngnix安装配置 检查是否已经安装了nginx 安装nginx必要的依赖库 gcc pcre zli ...

  5. Ubuntu 下搭建 Nginx 部署 vue 项目

    Ubuntu 下搭建 Nginx 部署 vue 项目 上一篇:Ubuntu 下部署 SpringBoot 第一步: Ubuntu 上安装 nodejs 执行 apt install nodejs 命令 ...

  6. VUE项目学习(三):win10版nginx部署vue项目

    VUE项目学习(三):win10版nginx部署vue项目 niginx的安装和启停操作参照博客:https://blog.csdn.net/qq_26666947/article/details/1 ...

  7. nginx部署vue项目,给访问路径加前缀

    Nginx安装与启动 去官网下载nginx压缩包,解压到电脑合适位置,我这放在D盘,目录是D:\nginx-1.21.6, 在这个路径,直接输入cmd,打开命令行,启动命令: nginx.exe 或者 ...

  8. Nginx部署Vue项目动态路由刷新404

    目录 前言 第一次 第二次 前言 记录下Nginx部署Vue项目刷新404的解决方案,遇到了两次,route用的是history路由模式,动态路由: {path: '/article/:blogId' ...

  9. Centos+Nginx部署Vue项目

    Centos+Nginx部署Vue项目 1.项目打包生成dist文件夹 在项目根目录下打开cmd窗口,输入命令 npm run build //生成dist文件夹 2.将dist文件夹上传到cento ...

最新文章

  1. 湖南工大计算机专业咋样,西北工业大学还是湖南大学计算机
  2. 1024,给大家谈谈如何搞透刷题 玩转力扣!
  3. java代码的运行顺序_java中的代码块执行顺序
  4. 关于定义视频播放器的界面的相关的类transPortcontroll等
  5. linux上用mplayer播放cue文件的设想
  6. .net core mvc初级教程(六)
  7. 腐蚀rust服务器命令_【使用 Rust 写 Parser】2. 解析Redis协议
  8. iOS web 、原生 js 交互:方法及原理
  9. Mybatis的生命周期及作用域
  10. 动易2007后台模板上传任意文件漏洞
  11. antd源码解读(6)- Affix
  12. 【DL-安装遇错】解决出现 pip‘s dependency resolver does not currently take into account all the packages that..
  13. 大作业-电影推荐系统
  14. PC端网页布局——世纪佳缘(二)页面初搭建
  15. 数据结构算法 - ConcurrentHashMap 源码解析
  16. 无法安装驱动程序 此计算机上不存在英特尔适配器,win10系统提示无法安装驱动程序,此计算机中没有Intel适配器怎么办...
  17. 【结构体】结构变量的定义与初始化
  18. 小程序的生命周期和页面的生命周期
  19. 爬取千库网ppt_python爬取千库网
  20. PSSH 轻量化运维工具安装和使用

热门文章

  1. python运用范围_如何在python中使用某个范围对数字列表进行分组?
  2. linux查看teamview是否运行,linux – 我如何知道teamviewer是否成功执行并获取会话ID和密码?...
  3. 玄惭 mysql_阿里云数据库专家玄惭的“武功”全记录之最佳实践、双十一特别篇...
  4. 1核1g服务器开多少虚拟主机,1核1g服务器开多少虚拟主机
  5. 定理在数学中的简写形式_西方把勾股定理叫毕达哥拉斯定理,我们的教材上是不是该改改名?...
  6. visual studio 2019配置OnnxRuntime+推理+vgg16
  7. Linux 下的动态链接库问题
  8. html标签slot,HTML slot 标签
  9. 文巾解题 181. 超过经理收入的员工
  10. matlab从入门到精通:图像可视化基础操作