如何把vue项目部署服务器(宝塔面板)上

news2025/1/11 4:16:23

一,vue项目打包

首先我们把准备好的vue项目进行打包:

输入命令:npm run build    生成dist文件

 

二、进入宝塔管理界面,点击网站,然后点击添加站点

 三。按下面输入

 点设置

四。 输入好点添加,注意!!!test.com 可以,有些已经有的不可以(如dada.com),且前面不能加www

 (1)这里需要删除一开始创建的114.56.55.198

(2)添加成功后点伪静类

五。 按下面输入,点击保存,  提示!!! 下面不输入可能导致404 not Found

location / {
  if (!-e $request_filename) {
    rewrite  ^(.*)$ /index.html?s=/$1  last;
    break;
  }
}

六。 找到指定文件(文件地址和文件名在第三步设置的)

 七。上传刚才打包好的dist文件 

点击上传,上传目录,选择dist文件,点击开始上传

上传好如下图

 

 八,点网站,点击设置,选择网站目录检查网站目录和运行目录是否和刚才上传dist文件目录一致,不一致需要修改 

 

 网址输入 test.com 结果访问成功

 Tips:

如果输入地址还是打不开,那么可能是以下几个原因

1,域名被用了,重新随便填个(如test.com,testtest.com)

 2.检查伪静态是否填写以及网站目录地址运行目录地址是否正确

3.在软件商店找到Nginx ,点设置,配置设置里,新增一段代码。贴到指定位置

贴代码 

  location  ^~ /consumption/ {
            try_files $uri $uri/ /consumption/index.html;
          } 

0k了

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/599107.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Python开发】FastAPI 04:响应模型

响应模型是指在接口调用之后,服务器返回给客户端的数据模型。这个数据模型可以是一个简单的字符串,也可以是一个复杂的数据结构,如 JSON 或 XML 格式的数据。本篇文章将详细介绍 FastAPI 中的响应模型。 目录 1 响应模型 1.1 response_mode…

HTML--Java EE

目录 一、认识 HTML 标签 二、HTML 文件基本结构 三、开发者工具 四、HTML常见标签 1.注释标签 2.标题标签(h1-h6) 3.段落标签(p) 4.换行标签 5.格式化标签 6.图片标签(img) 6.1网络路径 6.2绝…

Mysql索引慢解决

索引慢解决 explain关键字 explainSQL id执行顺序,id相同从上到下;id不同,如果是子查询id序号会递增,id值越大优先级越高;id相同和不同都存在时,id相同理解为一组,从上往下顺序执行&#xff0…

最优化——几种重要的凸集

引言 这是中科大最优化理论的笔记,中科大凌青老师的凸优化课程,详尽易懂,基础扎实。不论是初学者还是从业多年的人,都值得系统地好好学一遍。 本文介绍种重要的凸集:超平面与半空间、球和椭球、多面体、单纯形。 超平面与半空间…

202314读书笔记|《孩子们的诗》——简单的语言,击中每个人心中的诗意

202314读书笔记|《孩子们的诗》——简单的语言,击中每个人心中的诗意 《孩子们的诗》作者果麦。这本书中的诗都是孩子们写的,虽然他们或许并不认为自己写的是诗。每个人都想一直做一个孩子,好奇、天真、单纯、善良、简单,多美美好…

【产品应用】一体化步进电机在全自动折页机的应用

随着科技的不断发展,机器人技术也越来越成熟,智能化和自动化已经成为了现代工业的发展趋势。在这个趋势下,全自动折页机作为一种高效、精确的印刷设备,被广泛应用于各种印刷品的生产中。而一体化步进电机作为全自动折页机的关键部…

SpringBoot+Vue 前后端分离在线学习平台-在线教育平台

SpringBootVue 前后端分离在线学习平台-在线教育平台 本项目是完整的前后端分离,在线学习系统。【有完整部署视频教程】 创新点: ①基于阿里云短信平台完成手机号变更【短信验证码】 ②基于支付宝沙箱支付完成在线购买课程【在线支付】 ③基于apach-echa…

【Python】函数 ② ( 函数参数定义和使用 | 形式参数和实际参数 )

文章目录 一、函数参数定义和使用二、形式参数和实际参数 一、函数参数定义和使用 Python 函数参数 作用 : 在 Python 函数 执行时 , 可以 接受 外部 函数调用者 提供的数据 ; 在 Python 函数中 , 可以接受零个或多个参数 , 这些参数可以传递到函数中进行操作 ; 函数参数也可…

Java并发(九)----线程join、interrupt

1、join 方法详解 1.1 为什么需要 join? 下面的代码执行,打印 r 是什么? static int r 0; public static void main(String[] args) throws InterruptedException {test1(); } private static void test1() throws InterruptedException …

用C++ 包装STM32 官方固件库 - 链式调用改写初始化结构体

拿C 在固件库上套娃一层有几点原因: 固件库都是用C 写的,而我平时都用C,虽然是兼容的,但C 的一些特性我不喜欢;我不喜欢官方库的函数命名风格;各个厂家的固件库大同小异,但是“小异”的那一部分…

路径规划算法:基于旗鱼优化的路径规划算法- 附代码

路径规划算法:基于旗鱼优化的路径规划算法- 附代码 文章目录 路径规划算法:基于旗鱼优化的路径规划算法- 附代码1.算法原理1.1 环境设定1.2 约束条件1.3 适应度函数 2.算法结果3.MATLAB代码4.参考文献 摘要:本文主要介绍利用智能优化算法旗鱼…

Direct3D 12——几何——基础

在几何里可分为两种几何,一种是显式几何,另外一种是隐式几何。有不同的方式表示不同的几何 隐式几何 隐式实际上是说不会告诉具体的这些点点就在哪,只告诉你这些点满足的关系。表示一定的关系但并不会给实际的点 例子: 隐式几何…

Ubuntu开机桌面黑屏只有鼠标问题解决办法(搜狗输入法导致)

参考: Ubuntu开机桌面黑屏只有鼠标问题解决办法(搜狗输入法导致) 问题描述 笔者在安装完搜狗输入法重启电脑后,电脑开机黑屏,只有鼠标的光标可以移动。笔者一开始以为是系统问题,网上查阅资料才发现有大量…

华为OD机试之全量和已占用字符集(Java源码)

全量和已占用字符集 题目描述 给定两个字符集合,一个是全量字符集,一个是已占用字符集,已占用字符集中的字符不能再使用。 输入描述 输入一个字符串 一定包含,前为全量字符集 后的为已占用字符集已占用字符集中的字符一定是全量字…

安全架构审计

安全架构审计 目录概述需求: 设计思路实现思路分析1.什么是安全架构审计2.安全架构审计工具3.现在使用的工具4.安全架构审计报告 参考资料和推荐阅读 Survive by day and develop by night. talk for import biz , show your perfect code,full busy,ski…

最全Python+Selenium环境搭建教程-你绝对想不到有这么简单!

一,Selenium 简介 在华为工作了10年的大佬出的Web自动化测试教程,华为现用技术教程!_哔哩哔哩_bilibili在华为工作了10年的大佬出的Web自动化测试教程,华为现用技术教程!共计16条视频,包括:1. …

力扣动态规划专题(一)509 70 746 62 63 343 96 思路及C++实现

文章目录 动态规划509. 斐波那契数五步骤代码 70. 爬楼梯五步骤代码 746. 使用最小花费爬楼梯五步骤代码扩展 62. 不同路径动态规划数论 63. 不同路径 II五步骤代码 343. 整数拆分五步骤代码 96.不同的二叉搜索树五步骤代码 注意点: 动态规划 动态规划,…

Java多线程学习2

1. 多线程 线程与任务的关系 脱离了任务的线程是没有意义的 线程对象是通过Thread类来创建的 任务是通过Runnable接口来定义的 1.继承Thread类 2.实现Runnable接口 3.实现Callable接口 (与Runnable的区别,可以拿到返回值) Thread线程…

RK3588平台开发系列讲解(驱动基础篇)设备驱动 IO 控制

平台内核版本安卓版本RK3588Linux 5.10Android 12文章目录 沉淀、分享、成长,让自己和他人都能有所收获!😄 📢本篇我们来讲的 ioctl 接口。 在内核 3.0 以前,ioctl 接口的名字叫 ioctl;内核 3.0 以后,ioctl 接口的名字叫 unlocked_ioctl。unlocked_ioctl就是 ioctl 接…

基于深度学习的高精度血小板检测识别系统(PyTorch+Pyside6+YOLOv5模型)

摘要:基于深度学习的高精度血小板检测(红细胞RBC、白细胞WBC和血小板Platelet)识别系统可用于日常生活中或野外来检测与定位血小板目标,利用深度学习算法可实现图片、视频、摄像头等方式的血小板目标检测识别,另外支持…