使用nginx在contos7上部署vue项目

最新推荐文章于 2024-06-22 20:34:56 发布
最新推荐文章于 2024-06-22 20:34:56 发布
阅读量710 收藏 5
点赞数 2
分类专栏： vue 文章标签： centos linux nginx vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_45632139/article/details/106173050
版权
本文详细介绍了如何在CentOS7系统中部署Vue项目，包括安装Nginx，打包Vue项目，上传dist文件到服务器，以及配置Nginx服务器。通过一步步操作，最终实现通过Nginx服务器访问Vue应用。
摘要由CSDN通过智能技术生成

Vue项目部署到centos7系统服务器

1.安装nginx并启动

1.1下载安装包

cd /usr/local (切换路径)

wget http://nginx.org/download/nginx-1.6.2.tar.gz (选择一个比较稳定的版本下载即可，或者手动下载后，用xshell传到该目录下也行)

1.2 解压安装

tar -zxvf nginx-1.6.2.tar.giz -C /usr/local (local这个目录类似于Windows的program目录，所以一些软件可以都安装在这里)

1.3 下载依赖的库文件

​ yum install pcre
​ yum install pcre-devel

 yum install zlib
 yum install zlib-devel

1.4 进行configure 配置

cd /usr/local/nginx-1.6.2 && ./configure –prefix=/usr/local/nginx
在这里插入图片描述
1.5 编译安装 (cd 到解压好的nginx-1.6.2，这个目录下安装编译)

make && make install
在这里插入图片描述
1.6 启动Nginx

​ 执行完5步骤后，cd 到/usr/local/ng

最低0.47元/天 解锁文章
rennan…
关注
  • 2
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
在centos 7 nginx 中部署vue项目
心如海的博客
06-05 1065
nginx 中部署vue项目
Centos7编译安装Nginx并打包部署Vue 项目
极客星云-CSDN博客
12-28 3029
阿里云Centos7编译安装Nginx并打包部署Vue 项目
Nginx服务简单的本地配置，运行Vue项目
最新发布
m0_63544346的博客
06-22 201
测试访问，如果是显示刚才打包的Vue项目则表示成功。显示Nginx欢迎页表示启动成功。在Nginx目录下打开终端。文件夹复制到Nginx的。可查看正在运行的服务。在项目目录下打开终端。，重新加载Nginx。
centos7 部署vue到 nginx
qq_16488609的博客
04-06 472
Vue.js是客户端语言，所以部署的时候是不需要基于nodejs或其他服务器运行环境，只需要像其他静态站点的方式发布就可以了，下面介绍一下VueJs具体发布的流程还有需要注意的点 项目打包命令 npm run build 把打包的dist压缩zip包，使用ftp工具上传到服务器，解压如果没有解压工具需要安装如下 一、安装支持ZIP的工具 yum install -y unzi...
nginx 部署vue项目
weixin_39255905的博客
06-12 1028
nginx 部署vue 项目
CentOS安装nginx，部署vue项目
让梦想疯狂
06-17 1878
/usr/local/nginx/sbin/nginx 1、安装nginx依赖包 yum install gcc-c++ -y yum install pcre pcre-devel -y yum install zlib zlib-devel -y yum install openssl openssl-devel -y 2、下载安装包和解压 # 安装之前，最好检查一下是否已经安装有nginx find -name nginx # 如果系统已经安装了nginx，那么就先卸载 yum remo.
nginx部署多个vue项目的方法示例
11-19
今天由于公司需求，需要在同一域名端口下，部署两个项目；今天花了一上午终于弄好了，选择赶紧做一个笔记。 如何连接阿里云服务器就不在这里说了，请看我以前的文章。 首先需要的效果 http://47.97.244.83/login ...
cenos7 下 docker 部署 vue+nginx
01-30
cenos7 下 docker 部署 vue+nginx 步骤
Vue打包部署到Nginx时,css样式不生效的解决方式
10-15
在Vue项目开发中，使用Vue CLI构建应用后，通常会通过`npm run build`命令生成一个用于部署的dist目录。然而，在将这个dist目录部署到Nginx服务器时，可能会遇到CSS样式不生效的问题。这个问题通常与静态资源的路径...
Centos7 部署若依前后端分离项目
01-09
nginx配置文件二、Centos7 环境准备2.1. 安装mysql并启动2.2. 安装redis并启动2.3. 安装nginx 和配置nginx.conf文件三、测试验证3.1. 上传准备好的文件3.2. 启动后端项目3.3. 登录验证.附上完整的nginx配置文件 一...
centos+nginx+vue+django部署办法.docx
12-04
这篇文章将指导用户在 CentOS 系统上部署 Nginx 服务器，并使用 Vue 和 Django 框架搭建一个完整的 Web 应用程序。下面是详细的部署步骤： 安装 Nginx 1. 首先，需要安装所需的依赖包，使用以下命令：`yum -y ...
nginx下部署vue项目的方法步骤
09-29
主要介绍了nginx下部署vue项目的方法步骤，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
centos安装nginx，部署vue项目
blog_zxb的博客
12-27 1137
参考： Centos下Nginx安装与配置 参考： Nginx 支持websocket的配置 参考： Centos7下的nginx设置开机自动启动 参考：vue-router HTML5 History 模式（解决F5后页面404或空白） 参考：nginx官方设置文档 centos安装nginx，部署vue项目 1、安装nginx依赖包 # 首先安装必要的库（nginx 中g...
centos7配置 vue_Centos7 使用nginx部署vue项目
weixin_32183107的博客
01-14 204
一、安装nginx#设置源sudo rpm -Uvh http://nginx.org/packages/centos/7/noarch/RPMS/nginx-release-centos-7-0.el7.ngx.noarch.rpm#安装yum install -y nginx#启动服务systemctl start nginx.service#关闭服务systemctl stop nginx....
Vue项目上线(阿里云centos7+nginx)
No way
07-05 3466
由来 自己原来做的一个网易云音乐的项目最近想把它上线，而且服务器也买了好久，因为一直没有学习Linux知识就一直搁置着，近来暑假快到了就想着捣鼓一下，项目github地址,上线地址，阿里云备案也太麻烦了吧:)，还有就是感谢大佬的网易云API 步骤 首先当然是阿里云服务器购买以及Vue项目的编写了，服务器购买就不说了，Vue项目打包npm run dev的时候要注意一下，主要是config/...
Neginx配置
wujianjun6932的专栏
03-08 1113
./configure \ --prefix=/usr/local/nginx \ --pid-path=/var/run/nginx/nginx.pid \ --lock-path=/var/lock/nginx.lock \ --error-log-path=/var/log/nginx/error.log \ --http-log-path=/var/log/nginx/acces
使用centos 7 和nginx部署vue或react项目
y227766的博客
07-28 1737
手把手教你 使用centos 7 和nginx 搭配使用Xshell和Xftp部署vue或react项目
Nginx安装配置及vue项目部署【Centos7】
on the way . . .
12-23 1064
网上好多都是源码安装，各种编译环境安装配置，感觉太麻烦了，这里直接下载一个rpm包就行了，离线安装也方便。选择你要使用的版本下载。
Centos+Nginx部署Vue项目
宁不知的博客
10-28 4476
Centos+Nginx部署Vue项目 1.项目打包生成dist文件夹 npm run build //生成dist文件夹 2.将dist文件夹上传到centos7 //我的放在 /home/dist 3.安装nginx 推荐链接： https://www.cnblogs.com/kaid/p/7640723.html 4.nginx的几个常用命令 //进入 /sbin目录下 cd /us...
centos7 使用Nginx部署vue项目步骤
05-14
以下是在 CentOS 7 上使用 Nginx 部署 Vue 项目的步骤： 1. 安装 Nginx ```shell sudo yum install nginx ``` 2. 配置 Nginx 进入 Nginx 配置目录： ```shell cd /etc/nginx/conf.d ``` 创建一个新的配置文件： ```shell sudo nano myproject.conf ``` 在配置文件中添加以下内容： ``` server { listen 80; server_name yourdomain.com; root /var/www/myproject; location / { try_files $uri $uri/ /index.html; } location /api/ { proxy_pass http://localhost:3000/; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; } } ``` 其中： - `listen` 指定 Nginx 监听的端口号，这里是 80。 - `server_name` 指定你的域名或者 IP 地址。 - `root` 指定 Vue 项目的根目录。 - `location /` 指定访问根路径时的处理方式，这里是尝试查找 URI 对应的文件或者目录，如果都找不到则返回 `index.html` 文件。 - `location /api/` 指定访问 `/api` 路径时的处理方式，这里是将请求转发到本地 3000 端口，需要结合你的后端接口进行调整。 保存并退出配置文件。 3. 部署 Vue 项目 将打包好的 Vue 项目文件复制到 `/var/www/myproject` 目录下： ```shell sudo cp -r /path/to/your/vue/project /var/www/myproject ``` 4. 启动 Nginx ```shell sudo systemctl start nginx ``` 5. 验证配置是否生效 在浏览器中访问你的域名或者 IP 地址，应该能够看到 Vue 项目的首页。 如果出现问题，可以查看 Nginx 的日志文件 `/var/log/nginx/error.log` 进行排查。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值