用Nginx打包部署vue3项目及404和500解决
- 打包vue3
npm run build
- 安装Nginx
这里安装步骤比较繁琐,现在服务器比较便宜,如果想用Nginx,可以去菜鸟教程https://www.runoob.com/linux/nginx-install-setup.html
配置安装一下 - 找到安装路径下的
conf文件夹 下nginx.conf文件,用编辑器打开这个文件
里边的
listen 8080; 端口号
server_name localhost;location /{root vue项目打包后的dist文件路径index dist中访问入口文件
}

4. 去cmd中检查一下配置的文件,
在Nginx 安装的conf路径外面执行命令
nginx -t -c 磁盘\conf\nginx.conf 回车
可以看到successful 配置成功

5. 启动 Nginx
start nginx

这时候可以去任务管理器中查看 是否启动成功,成功可以在任务管理器进程中看到

6. 在浏览器中访问配置的路径 http://localhost:8080/ 这个是我的配置,大家可以查看上面 第3 步 配置的具体是什么
访问之后再次刷新页面会报404

7. 404解决
这里因为 找指定路径的文件,如果不存在,我们就转给按个文件
在 Nginx.conf文件下继续配置
listen 8080; 端口号
server_name localhost;location /{root vue项目打包后的dist文件路径index dist中访问入口文件try_files $uri $uri/ @router; //找指定路径的文件,如果不存在,我们就转给按个文件}
start nginx 检查配置是否成功
成功后去 任务管理器中把以前启动的 Nginx 关掉,然后重启 这里是以免启动太多,最好手动全部关掉
再次重启
start nginx
浏览器 访问 http://localhost:8080/ 这时候刷新404问题解决,哎,又出现500问题,继续Nginx.conf配置

listen 8080; 端口号
server_name localhost;location /{root vue项目打包后的dist文件路径index index.html index.htm; //dist中访问入口文件try_files $uri $uri/ @router; //找指定路径的文件,如果不存在,我们就转给按个文件}
location @router {rewrite ^.*$ /index.html last;
}
start nginx
关掉任务管理器中的Nginx 然后再次重启
打开浏览器 http://localhost:8080/
500问题解决,报405错误,剩下的是后台,我们前端到此配置完成

总结以上步骤

相关文章:
用Nginx打包部署vue3项目及404和500解决
打包vue3 npm run build安装Nginx 这里安装步骤比较繁琐,现在服务器比较便宜,如果想用Nginx,可以去菜鸟教程https://www.runoob.com/linux/nginx-install-setup.html 配置安装一下找到安装路径下的 conf 文件夹 下 nginx.conf文件࿰…...
Java面试——多线程并发篇
✅作者简介:2022年博客新星 第八。热爱国学的Java后端开发者,修心和技术同步精进。 🍎个人主页:Java Fans的博客 🍊个人信条:不迁怒,不贰过。小知识,大智慧。 💞当前专栏…...
维基百科数据抽取
1. 数据路径 https://dumps.wikimedia.org/enwiki/latest/ ----英文 https://dumps.wikimedia.org/zhwiki/latest/ ----中文 https://dumps.wikimedia.org/enwiki/latest/enwiki-latest-pages-articles.xml.bz2 --下载最新的 https://dumps.wikimedia.org/wikidatawiki/2023…...
2020年因果推断综述《A Survey on Causal Inference》
最近阅读了TKDD2020年的《A Survey on Causal Inference》,传送门,自己对文章按照顺序做了整理,同时对优秀的内容进行融合,如有不当之处,请多多指教。 文章对因果推理方法进行了全面的回顾,根据传统因果框…...
嵌入式linux系统测试程序编写
文章目录 网络CPU load监测性能设定开源测试工具iozone —— 文件系统测试工具iperf —— 网络性能测试工具LMbench —— 系统性能评测LTP —— linux功能/性能压力测试memtester —— 内存测试,坏位检测stressapptest —— 内存流量压力测试stream —— 内存性能测试fio ——…...
力扣SQL刷题5
目录597. 好友申请 I:总体通过率602. 好友申请 II :谁有最多的好友603. 连续空余座位1045. 买下所有产品的客户597. 好友申请 I:总体通过率 官方讲的题目太繁琐了,大概就是(表2中列1列2不全相同的行数)/&a…...
动态规划详解(完结篇)——如何抽象出动态规划算法?以及解题思路
今天直接开始讲解FIRST:如何抽象出动态规划算法?这个问题,困扰了无数代OIER,包括本蒟蒻在比赛的时候,看一道题,怎么想到他是什么算法的呢?这就需要抽象能力而不同的算法,往往有着不同…...
C语言一维数组篇【下】——每日刷题经验分享
一维数组篇——每日刷题经验分享~😎前言🙌有序序列插入一个整数 😊序列中删除指定数字 😊序列中整数去重小乐乐查找数字筛选法求素数总结撒花💞😎博客昵称:博客小梦~ 😊最喜欢的座右…...
VHDL语言基础-组合逻辑电路-其它组合逻辑模块
目录 多路选择器: 逻辑功能: 常用的类型: 4选1多路选择器的实现: 求补器: 求补器的实现: 三态门: 三态门的应用实例: 三态门的实现: 缓冲器: 什么是…...
初识Vue
文章目录1. 前言2. Vue 的特点3. 安装 Vue4. HelloWord1. 前言 vue是什么 ? 引用 : vue.js 文档 Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层…...
TOUGH系列软件建模实践方法及在地下水、CO2地质封存、水文地球化学、地热等多相多组分系统多过程耦合
查看原文>>> https://mp.weixin.qq.com/s?__bizMzAxNzcxMzc5MQ&mid2247578057&idx7&sn75f8d2c1c6edb28af76a8db4bb773de3&chksm9be2aed9ac9527cf0081082cdcf781e6c37f9f3ba383332ed1116abcbee0f05c0593187e964d&token2070450548&langzh_CN#r…...
Codeforces Round #699 (Div. 2)
E. 题意:n本书,每本书有颜色a[i],一次操作可以将其中一本书放在末尾,求满足:相同颜色的书都是相邻的 的最小操作次数. 显然最多只需要n次,考虑能节省多少次.倒着考虑,记f[i]为i~n最多能节约的次数.先预处理出每种颜色的出现的位置范围l[i],r[i]. 1.不节约这本书f[i] f[i 1]…...
MySQL存储过程的传参和流程控制
目录 一.存储过程传参—in 演示 二.存储过程传参—out 演示 三.存储过程传参—inout 演示 四.流程控制—判断 格式 演示 五.流程控制—case 语法 演示 六.流程控制—循环 循环—while 循环—repeat 循环—loop 一.存储过程传参—in in表示传入的参数,可以传…...
MySQl学习(从入门到精通11)
MySQl学习(从入门到精通11)第 14 章_视图1. 常见的数据库对象2. 视图概述2. 1 为什么使用视图?2. 2 视图的理解3. 创建视图3. 1 创建单表视图3. 2 创建多表联合视图3. 3 基于视图创建视图4. 查看视图5. 更新视图的数据5. 1 一般情况5. 2 不可…...
关于ThreadLocal
弱引用 1.1 java中的各种引用和测试: https://blog.csdn.net/thewindkee/article/details/102723838 1.2 treadlocal中的弱引用测试: https://blog.csdn.net/thewindkee/article/details/103726942 (这篇很重要) 内存泄露: https://zhuanlan.zhihu.com/p/523628871 综合考虑 …...
【C++】类和对象(中)
文章目录1. 类的6个默认成员函数2. 构造函数概念特性3. 析构函数概念特性4. 拷贝构造函数概念特征5. 运算符重载5.1 前置和后置重载5.2 赋值运算符重载6. 日期类的实现7. const成员8. 取地址及const取地址操作符重载1. 类的6个默认成员函数 如果一个类中什么成员都没有&#x…...
js下载文件
url为文件的src地址 url必须符合同源策略或者url的接口地址允许跨域,否则浏览器会报跨域错误 axios.get(data.url ,{ responseType: ‘blob’, }) .then( response>{ let blob new Blob([response.data]); let url window.URL.createObjectURL(blob); // 创建 …...
ESP8266 + STC15+ I2C OLED带网络校时功能的定时器时钟
ESP8266 + STC15+ I2C OLED带网络校时功能的定时器时钟 📍相关篇《ESP8266 + STC15基于AT指令通过TCP通讯协议获取时间》 📌ESP8266 AT固件基于安信可AT固件,相关刷AT固件可以参考《NodeMCU-刷写AT固件》 🔖STC15 单片机采用的是:STC15F2K60S2 晶振频率采用内部:22.11…...
计算机入门基础知识大全
♥️作者:小刘在C站 ♥️个人主页:小刘主页 ♥️每天分享云计算网络运维课堂笔记,努力不一定有收获,但一定会有收获加油!一起努力,共赴美好人生! ♥️夕阳下,是最美的,绽…...
Python程序出现错误怎么办?
Python 异常处理 python提供了两个非常重要的功能来处理python程序在运行中出现的异常和错误。你可以使用该功能来调试python程序。 异常处理: 本站Python教程会具体介绍。 断言(Assertions):本站Python教程会具体介绍。 python标准异常 异常名称 描述 BaseException 所有异常…...
应用升级/灾备测试时使用guarantee 闪回点迅速回退
1.场景 应用要升级,当升级失败时,数据库回退到升级前. 要测试系统,测试完成后,数据库要回退到测试前。 相对于RMAN恢复需要很长时间, 数据库闪回只需要几分钟。 2.技术实现 数据库设置 2个db_recovery参数 创建guarantee闪回点,不需要开启数据库闪回。…...
UDP(Echoserver)
网络命令 Ping 命令 检测网络是否连通 使用方法: ping -c 次数 网址ping -c 3 www.baidu.comnetstat 命令 netstat 是一个用来查看网络状态的重要工具. 语法:netstat [选项] 功能:查看网络状态 常用选项: n 拒绝显示别名&#…...
376. Wiggle Subsequence
376. Wiggle Subsequence 代码 class Solution { public:int wiggleMaxLength(vector<int>& nums) {int n nums.size();int res 1;int prediff 0;int curdiff 0;for(int i 0;i < n-1;i){curdiff nums[i1] - nums[i];if( (prediff > 0 && curdif…...
将对透视变换后的图像使用Otsu进行阈值化,来分离黑色和白色像素。这句话中的Otsu是什么意思?
Otsu 是一种自动阈值化方法,用于将图像分割为前景和背景。它通过最小化图像的类内方差或等价地最大化类间方差来选择最佳阈值。这种方法特别适用于图像的二值化处理,能够自动确定一个阈值,将图像中的像素分为黑色和白色两类。 Otsu 方法的原…...
【算法训练营Day07】字符串part1
文章目录 反转字符串反转字符串II替换数字 反转字符串 题目链接:344. 反转字符串 双指针法,两个指针的元素直接调转即可 class Solution {public void reverseString(char[] s) {int head 0;int end s.length - 1;while(head < end) {char temp …...
【配置 YOLOX 用于按目录分类的图片数据集】
现在的图标点选越来越多,如何一步解决,采用 YOLOX 目标检测模式则可以轻松解决 要在 YOLOX 中使用按目录分类的图片数据集(每个目录代表一个类别,目录下是该类别的所有图片),你需要进行以下配置步骤&#x…...
AI编程--插件对比分析:CodeRider、GitHub Copilot及其他
AI编程插件对比分析:CodeRider、GitHub Copilot及其他 随着人工智能技术的快速发展,AI编程插件已成为提升开发者生产力的重要工具。CodeRider和GitHub Copilot作为市场上的领先者,分别以其独特的特性和生态系统吸引了大量开发者。本文将从功…...
实现弹窗随键盘上移居中
实现弹窗随键盘上移的核心思路 在Android中,可以通过监听键盘的显示和隐藏事件,动态调整弹窗的位置。关键点在于获取键盘高度,并计算剩余屏幕空间以重新定位弹窗。 // 在Activity或Fragment中设置键盘监听 val rootView findViewById<V…...
高防服务器能够抵御哪些网络攻击呢?
高防服务器作为一种有着高度防御能力的服务器,可以帮助网站应对分布式拒绝服务攻击,有效识别和清理一些恶意的网络流量,为用户提供安全且稳定的网络环境,那么,高防服务器一般都可以抵御哪些网络攻击呢?下面…...
【数据分析】R版IntelliGenes用于生物标志物发现的可解释机器学习
禁止商业或二改转载,仅供自学使用,侵权必究,如需截取部分内容请后台联系作者! 文章目录 介绍流程步骤1. 输入数据2. 特征选择3. 模型训练4. I-Genes 评分计算5. 输出结果 IntelliGenesR 安装包1. 特征选择2. 模型训练和评估3. I-Genes 评分计…...
