将Vue项目部署到阿里云服务器的CentOS系统以及nginx服务器的安装与配置

最新推荐文章于 2024-05-17 12:58:20 发布
最新推荐文章于 2024-05-17 12:58:20 发布
阅读量669 收藏 2
点赞数 1
分类专栏： 阿里云服务器搭建 文章标签： nginx centos 服务器
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43334673/article/details/108828570
版权
下面的操作是在ES服务器终端上输入命令安装nginx，所以你得先有一台服务器。连接阿里云服务器终端有很多工具，这里可以使用阿里云服务器自带的远程连接，也可以使用Xshell软件。文章目录Nginx的安装1 安装编译工具及库文件2.安装PCRE3.安装nginx4.nginx配置(重点)5. 将vue打包的dist文件部署到阿里云服务器Nginx的安装1 安装编译工具及库文件 yum -y install make zlib zlib-devel gcc-c++ libtool openssl .
摘要由CSDN通过智能技术生成

下面的操作是在ES服务器终端上输入命令安装nginx，所以你得先有一台服务器。连接阿里云服务器终端有很多工具，这里可以使用阿里云服务器自带的远程连接，也可以使用Xshell软件。

文章目录

Nginx的安装

1 安装编译工具及库文件
	yum -y install make zlib zlib-devel gcc-c++ libtool  openssl openssl-devel

（yum命令可以直接使用，不用再安装）
在这里插入图片描述

2.安装PCRE

2.1 下载PCRE安装包：

	1. cd /usr/local/src/

	2. wget http://downloads.sourceforge.net/project/pcre/pcre/8.35/pcre-8.35.tar.gz

在这里插入图片描述
2.2解压安装包：

	tar zxvf pcre-8.35.tar.gz

在这里插入图片描述
2.3 进入安装包目录并编译安装

	1. cd pcre-8.35
	2. ./configure
	3. make && make install

在这里插入图片描述
在这里插入图片描述
2.4安装成功就可以查看pcre版本

	pcre-config --version

在这里插入图片描述

3.安装nginx

3.1 下载nginx

	1. cd /usr/local/src/
	2. wget http://nginx.org/download/nginx-1.6.2.tar.gz

最低0.47元/天 解锁文章
鸭绒
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
阿里云centos上部署nginx和vue项目
weixin_44385241的博客
10-16 415
1.要在服务器（centos系统）上安装nginx服务器，部署好vue项目，让外网访问到，首先要有服务器，我选择的是阿里云的centos7.5系统的版本，在确认订单那有自定义密码的，要记得登录名和登录密码，在之后连接远程服务器要用到（root为登录名） 2.之后要在该服务器上配置好规则，开放端口给外网访问到，nginx服务器默认监听80端口，所以先开放80端口（配置位置在控制台中的本实例安全组中的规则配置） 3.配置好开放端口后，再下载Xshell和Xftp，Xshell用来连接远程服务器并用命令行的
在阿里云服务器上配置CentOS+Nginx+Python+Flask环境
12-24
阿里云(单核CPU, 1G内存, Ubuntu 14.04 x64 带宽1Mbps), 具体购买和ssh连接阿里云本文不做描述。 实用工具 首先进入阿里云后先要升级下apt-get, 并下载所需软件 sudo apt-get update sudo apt-get install vim git ...
vue项目如何部署到nginx服务器
热门推荐
田兴的博客
11-12 3万+
mac下安装nginx 安装工具： homebrew（还没用过的小伙伴可以点链接进行了解或者自行百度） 步骤： 1、打开终端，习惯性命令：更新 brew update 2、终端继续执行命令： brew search nginx //查询要安装的软件是否存在 3、这里我们多执行一步“废”命令，不过有利于我们后面的配置： brew info nginx 我们可以看到，nginx在本地还未安装（Not installed），nginx的来源（From），Docroot默认为/usr/local/v
Vue项目部署到Nginx服务器
最新发布
极限突破者的博客
05-17 1089
本文将详细介绍如何将Vue前端项目部署到Nginx服务器。Nginx是一款开源的高性能HTTP服务器和反向代理服务器。
将通过vue-cli创建的vue项目部署到nginx上
m0_53886762的博客
03-17 3601
1、在vscode新建终端，使用npm run build打包项目，打包完成会在根目录下生成dist文件夹 2、将nginx文件夹下的html文件夹内的内容删除替换为dist文件夹下的额文件或者打开nginx.conf配置文件（位于conf文件夹下），将server内的 location / { root testtwe; index index.html index.htm; } root后的内容替换为新建的文件夹，并将dist文件夹下的内容复制到新文件夹下 3、通过 start nginx
Vue 项目部署到阿里云服务器（Nginx 代理）
huatian5的博客
01-06 4816
1.本地打包 首先，要将本地 config/index.js 中的 assetsPublicPath: '/', 改为 assetsPublicPath: './', ，否则在会导致部署后网页无法显示 然后 cnpm run build 打包生成 dist 文件夹 2.安装 Nginx 安装 epel （为 CentOS、Scientific Linux 提供高质量软件开发包） yum -y in...
vue项目部署到centos7.6服务器（使用nginx）
weixin_42138029的博客
03-09 1729
一、vue前端代码准备工作： 1、目录结构 2、在 npm run build 之前 将/src/config/index.js文件中的assetsPublicPath: '/', 改为assetsPublicPath: './',否则当打开页面时会出现空白页的情况。 3、若项目使用的elementUI，编译后可能会出现elementUI自带icon变为小方框情况，解决办法：修改...
Vue打包部署到Nginx时,css样式不生效的解决方式
10-15
总结来说，解决Vue打包部署到Nginx时CSS样式不生效的问题，需要关注Vue CLI的打包配置（尤其是`assetsPublicPath`），以及Nginx的MIME类型配置。正确设置这些参数，可以确保CSS和其他静态资源被正确地服务和解析，...
nginx部署多个vue项目的方法示例
11-19
如何连接阿里云服务器就不在这里说了，请看我以前的文章。 首先需要的效果 http://47.97.244.83/login http://47.97.244.83/student/login 文件目录 两个项目并列在同一文件夹内。 准备好两个vue的项目 ...
cenos7 下 docker 部署 vue+nginx
01-30
cenos7 下 docker 部署 vue+nginx 步骤
centos+nginx+vue+django部署办法.docx
12-04
这篇文章将指导用户在 CentOS 系统上部署 Nginx 服务器，并使用 Vue 和 Django 框架搭建一个完整的 Web 应用程序。下面是详细的部署步骤： 安装 Nginx 1. 首先，需要安装所需的依赖包，使用以下命令：`yum -y ...
Vue.js项目部署到服务器的详细步骤
12-12
前言 　　最近做完了一个项目，Vue.js 2.0 + vuex + axios，还是有点大的。想着做了这么久，放服务器给朋友们体验一下，帮忙找找BUG，于是就有了研究服务器这一篇文章了。 准备工作 服务器 既然是部署到服务器，肯定是需要一个云的。我这里找基友拿的一个，做测试的话，可以买阿里云的学生机，9.9 一个月，不过不是学生的话就比较麻烦，因为涉及敏感操作都需要验证码。 编译打包 将项目打包成 dist 文件，这里我需要跨域请求一些数据，还写了一个小型服务器， app.js 放到 dist 文件夹 同级目录。 Xshell 因为基友的是 centos 的服务器，所以用 xshell 的话
用Nginx将前端Vue项目部署到云服务器（含代理实现请求跨域）
m0_62556296的博客
10-24 2481
记录使用Nginx将的Vue3项目部署到阿里云服务器（Ubuntu 22.04）上，包含通过Nginx代理实现、以及个人踩坑记录~
Linux CentOS 将VUE项目部署到nginx上 或者 tomcat项目上
perfectmetoo的博客
03-19 306
一、前端vue文件打包 生成一个dist文件夹
vue项目打包部署到centos系统nginx服务器
qq_43568790的博客
02-11 999
需要注意的问题有 1.如果页面不显示，说明路径有问题 进入index.js中，修改如下 把 “/“修改为”./”，这样就能够显示页面了 2.elementUI不显示的问题 进入utils.js中，修改如下 添加 publicPath:’…/…/’,之后elementUI就显示出来了 ...
阿里云安装Nginx+vue项目部署
samHuangLiang的博客
08-19 1784
首先我们要先下载nginx的安装包: http://nginx.org/en/download.html Nginx安装一： 首先先安装PCRE pcre-devel 和Zlib，因为配置nginx的时候会需要这两个东西 PCRE(Perl Compatible Regular Expressions) 是一个Perl库，包括 perl 兼容的正则表达式库。nginx 的 http 模块使用 ...
centos 安装nginx 并部署vue项目
weixin_45089791的博客
11-18 1612
前言 因为之前在学校期间学习时一直使用的linux是ubuntu系统，最近在工作期间大哥让我在centos上安装nginx 并部署一下前端的vue项目，至此就记录一下步骤。 一. gcc 安装 安装 nginx 需要先将官网下载的源码进行编译，编译依赖 gcc 环境，如果没有 gcc 环境，则需要安装： yum install -y gcc-c++ 二. PCRE pcre-devel 安装 PCRE(Perl Compatible Regular Expressions) 是一个Perl库，包括 pe
阿里云ECS服务器的vue项目上传部署
Chen332855269的博客
10-16 2242
项目上传服务器流程 （vue-SPA项目） 一、买服务器(机器) 1. 云服务器ECS 2. 支付宝-》注册-》实名认证填写身份证的信息-》ecs 3. 手动停止服务器 ----> 初始化磁盘 ---> 重设密码（登录密码,选择Linux系统的，用户名一般为root，登录密码后面使用finalshell 连接远端使用，需要记好) 二、使用finalShell连接服务器 1...
小白Vue3+Nginx实现部署
Sumuxi9797926的博客
12-09 9164
记录一下自己想搭建一个自己的个人网站的心路历程，其实我刚开始的落脚点是找一个别人的半成品或者成品，再慢慢的改，想把主要的精力放在后台上面，找了很多网站之后，例如,，不是项目很久没有维护了，就是好看的没有适合我的🙃（怪我，太菜了~傻狗哽咽🐮🐴），最后还是决定用vue3自己从0开始学，开始搭建。
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、付费专栏及课程。

余额充值