vue3项目的部署到阿里云服务器

已于 2022-03-23 15:40:43 修改
阅读量2.3k 收藏 8
点赞数
分类专栏： vue项目上线阿里云 阿里服务器 文章标签： vue vue.js cli
于 2021-06-05 20:47:14 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/preserveXing/article/details/117604859
版权
本文介绍了如何将Vue3项目部署到阿里云服务器，重点在于配置路由的base选项以避免路径冲突，以及在Vue3缺少webpack配置文件的情况下，如何创建vue.config.js进行自定义配置，确保静态资源路径正确，防止请求错误。
摘要由CSDN通过智能技术生成

vue3项目的部署

1.配置路由的 让文件路由和服务器的路径对应起来

在这里插入图片描述
在路由中设置全局的配置
默认

‘/’
path: /login --实际上—> ’ /login’
放到服务器上 就是 http:120.32.62.45/login
想一想 如果你有2个vue项目放到服务器 都是path:/login 那么此时 /login 一定会冲突

base配置后

/wuyu/
path: /login -实际上—> ’ /wuyu/login’
放到服务器上 就是 http:120.32.62.45/wuyu/login
如果你有2个vue项目放到服务器 都是path:/login
项目一就是:path:/login 将会是/vue1存放文件夹/login
项目二就是:path:/login 将会是/vue2存放文件夹/login
不会冲突

2.因为vue3的项目目录 和vue2有这一定的不同

vue3 创建的项目文件目录
在这里插入图片描述
vue2的项目文件

最低0.47元/天 解锁文章
门前大桥下.
关注
  • 0
    点赞
  • 踩
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
前后端分离 -- SpringBoot + Vue实战项目 部署至阿里云服务器
04-18
本项目用于部署至Linux服务器案例项目 该项目技术栈为：SpringBoot + Spring Security + Vue + ElementUI 前后端分离实现整体项目 一个简单的前后端分离项目
Vite4 + Vue3 项目打包并发布Nginx服务器 (前端必看)
热门推荐
Etc.End的博客
03-26 1万+
这里因为我们有的小伙伴可能不太需要服务器，单纯学习的话也没有必要去买一个服务器。如果需要把自己的东西部署到公网上，有很多方式，自行百度。你也可以购买阿里云或者腾讯云。逻辑都是一样的，我这里使用的虚拟机+centos系统，我已经提前在自己的机器安装好了。感兴趣的小伙伴可以看我专栏。里面有从虚拟机、centos到一些开发工具的详细安装步骤。特别是我们这篇文章中要用到的nginx服务器。
使用阿里云服务器以及宝塔部署vue3项目和使用node.js的express项目
最新发布
2301_77451378的博客
07-06 1214
使用阿里云服务器和宝塔Linux面板部署vue3项目和基于node.js的express项目
【vue3项目部署到服务器上】
m0_70947033的博客
03-06 735
vue3项目部署到服务器上
用Nginx将前端Vue项目部署到云服务器（含代理实现请求跨域）
m0_62556296的博客
10-24 2615
记录使用Nginx将的Vue3项目部署到阿里云服务器（Ubuntu 22.04）上，包含通过Nginx代理实现、以及个人踩坑记录~
手把手教你如何把vue项目打包后部署到服务器（小白教程）
Orange71234的博客
06-21 1万+
（5）输入用户名密码登录出现如下页面 ，点击左侧网站-->添加站点-->输入域名-->根目录地址会 自动生成-->点击提交-->站点创建成功。1.vscode打开你的vue项目-- >点终端 -- >输入npm run build 按回车进行打包；3.下载安装好软件后双击打开，选择SSH连接，填写如下信息，最后点击确定。（7）点击上传，按照下图方式上传之前打包好的dist文件夹下的内容，(2)查看服务器是否安装宝塔，如安装则出现宝塔面板命令，(3)输入14，查看并复制外网面板地址以及用户名，密码。
【前端vue3项目部署】操作步骤
无邪的博客
10-05 485
视频源链接： https://www.bilibili.com/video/BV1YE411E7Xr/?
Vue.js项目部署到服务器的详细步骤
10-19
Vue.js项目部署到服务器的详细步骤涉及多个环节，包括前期准备、打包项目、服务器设置以及部署过程等。首先，需要确保你有一个云服务器。如果你是学生，可以购买阿里云的学生机，价格相对便宜。在服务器的选择上，...
Vue项目部署的实现（阿里云+Nginx代理+PM2）
12-12
Vue项目部署到阿里云ECS涉及的关键步骤包括配置Nginx代理、使用PM2管理和启动Node服务以及确保正确处理跨域请求。以下是对这些知识点的详细说明： 1. **Nginx代理**： - Nginx是一个高性能的HTTP和反向代理服务器...
把vue-router和express项目部署到服务器的方法
08-28
部署 Vue Router 和 Express 项目到服务器的方法 在本文中，我们将分享如何将 Vue Router 和 Express 项目部署到服务器的方法，这将对大家具有很好的参考价值。 首先，我们需要确定项目在本地能够运行成功。在本地...
(新手向)从零开始将springboot项目部署到云服务器（ecs）上
01-09
最近用springboot写了一个个人博客项目，正好之前趁着活动免费领取了一个阿里云的云服务器ecs，于是准备把项目部署到服务器上。对于我这种纯新手来说，部署过程可谓是踩坑无数,好在最后还是成功了。  这里跟大家...
Vue3学习(四)服务器部署
m0_64393446的博客
06-26 626
指令 cd /usr/local/nginx-1.24.0/sbin。运行 npm run build 即可打包。在 public文件夹新建config.json。修改package.json。main.js 里使用axios读取配置。Java后台启动脚本 start.sh。如果想打包Vue工程，需要修改打包配置。SpringBoot 打包。
vue3项目打包到上线到云服务器遇到的种种问题
u012147066的博客
02-19 1561
最近刚写完自己的第一个项目，过程中就有蛮多想写的，但没想到打包上线等收尾工作最让我头大，所以就先写这些了(项目过程中遇到的问题有时间也会发的)，菜鸟，很多概念都不是很清晰，但因为自己在遇到问题的时候很希望能找到一篇详尽的文章，所以有了这篇，希望能帮到你。
nginx+vite+Vue3 项目打包及部署到服务器二级路由
az051500的博客
06-06 1588
不用配置环境变量，vite.config.ts不用配置。在vite当中，官方提供了一些内置环境变量，其中就包括。例如：我希望将打包的项目部署到。的方式调用环境变量，此处为。，在项目文件中，必须通过。，之后，vite会将。
【前后端分离项目部署】关于“vue3+SpringBoot+阿里云服务器+宝塔操作”的打包部署全流程配置
m0_60935824的博客
10-19 1623
npm run 命令dist。
将vue3项目部署到Linux服务器中（nginx）
m0_59066523的博客
11-09 1049
ADD default.conf /etc/nginx/conf.d/：将default.conf复制到/etc/nginx/conf.d/下，用本地的default.conf配置来替换nginx镜像里的默认配置。COPY dist/ /usr/share/nginx/html/：将项目根目录下dist文件夹（构建之后才会生成）下的所有文件复制到镜像/usr/share/nginx/html/目录下。FROM nginx：该镜像是基于nginx:latest镜像构建的。default.conf内容。
VUE3搭载到服务器
LQ_001的博客
02-27 721
VUE3搭载到服务器
部署vue项目到阿里云服务器
liubangbo的专栏
10-27 5613
可能在make的时候会报2个错误，在网上搜一下就解决了。大概记得第一个错误是在MakeFile中删除-Werror，第二个错误是注释一行代码就可以了。记得vue项目包dist 一定要上传到Nginx 安装目录下的html目录，一般是/usr/local/nginx/html目录。我们试用阿里云ESC服务器(选择CentOS)，按步骤试用，稍等几分钟就会收到短信，创建实例成功。但不幸的是，打不开。4）用户名和密码填写我的在阿里云服务器设置的，一般用户名在没有修改的情况下都是root。
vue3+node全栈项目部署到云服务器
FHHHC的博客
10-31 803
一、前言　　 　　最近在B站学习了一下全栈开发，使用到的技术栈是Vue+Element+Express+MongoDB，为了让自己学的第一个全栈项目落地，于是想着把该项目部署到阿里云服务器。经过网上一番搜索和自己的一顿操作后，我在这里记录一下自己的部署过程，方便以后查阅。 参考博客： https://segmentfault.com/a/1190000012186563?utm_source=t...
vue项目部署到阿里云服务器上 使用linux
05-14
部署 Vue 项目到阿里云服务器可以分为以下几个步骤： 1. 安装 Node.js 和 npm 在 Linux 系统上安装 Node.js 和 npm 可以使用包管理器来安装，例如在 Ubuntu 系统上可以使用以下命令来安装： ``` sudo apt-get ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值