Vue项目Nginx配置自定义路径别名

第一步:在vite.config.js中配置base的路径

在打包项目之前需要在vite.config.js中配置base的路径,路径名为服务器自定义的路由别名:
比如:

import { fileURLToPath, URL } from "node:url";import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";export default defineConfig({plugins: [vue()],server: {host: true,},base: "/aaa/", // 这个配置很重要,要和nginx配置的路径别名一致resolve: {alias: {"@": fileURLToPath(new URL("./src", import.meta.url)),},},
});

第二步: 修改Nginx配置

server {listen 3000;...location / {index index.html index.htm;try_files $uri $uri/ /index.html;}# 新增location块,用于处理/aaa路径的请求location ^~ /aaa {alias /www/sites/web/index/dist;index index.html index.htm;try_files $uri $uri/ /aaa/index.html; # 如过vue项目使用的是History模式的路由,则必须加此行配置}
}

新增location后,重启Nginx,在浏览器输入http://服务器ip/aaa访问即可

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

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

相关文章

什么是隐马模型

目录 什么是隐马模型 举例简单理解 什么是隐马模型 隐马尔可夫模型(Hidden Markov Model,HMM)是一种统计模型,用于描述一个含有隐含未知参数的马尔可夫过程。其难点在于从可观察的参数中确定该过程的隐含参数,并利用这些参数来作进一步的分析,例如模式识别。 隐马尔可…

互联网轻量级框架整合之设计模式

反射技术 Java的反射技术能够通过配置类的全限定名、方法和参数完成对象的初始化,甚至反射某些方法,大大的增强了Java的可配置型,这也是Spring IoC的底层原理,Java的反射技术覆盖面很广,包括对象构建、反射方法、注解、…

JavaScript 中什么应用场景下必须用 map 而不是对象来实现功能

前言 很多情况下,能用 map 实现的功能用对象也可以实现,都是基于键值对,但是在一些情况下,必须要使用 map 才可以。 必须用 map 而不是 object 的情况 键的类型不限:普通对象的键总是被转换为字符串或者 Symbols&a…

C#简单工厂模式的实现

using System.Diagnostics.Metrics; using System.Runtime.InteropServices; using static 手写工厂模式.Program;namespace 手写工厂模式 {internal class Program{public interface eats {void eat();}//定义了一个接口public class rice : eats{public void eat() {Console.…

Qt快速入门(Opencv小案例之人脸识别)

Qt快速入门(Opencv小案例之人脸识别) 编译出错记录 背景 因为主要使用qt,并且官网下载的win版本的编译好的opencv默认是vc的,所以我们需要自己下载opencv的源码使用mingw自行编译,我直接使用的vscode。 报错 报错…

【JavaWeb】Day43.MySQL概述——索引

介绍 索引(index):是帮助数据库高效获取数据的数据结构 。简单来讲,就是使用索引可以提高查询的效率。 优点: 1. 提高数据查询的效率,降低数据库的IO成本。 2. 通过索引列对数据进行排序,降低数据排序的成本&#…

C++系列-C++前言

什么是C C语言是结构化和模块化的语言,适合处理较小规模的程序,对于复杂的问题,规模较大的程序,需要高度的抽象和建模时,C语言则不合适,为了解决软件危机,20世纪80年代,计算机界提出…

Ant Design Vue Table 自定义渲染与自定义单元格

自定义渲染 自定义渲染主要通过customRender属性来实现,它允许你针对特定的列定义自己的渲染逻辑。通常情况下,你需要提供一个函数,这个函数会接收三个参数:text(待渲染的文本)、record(整行数…

Python 编程 深入了解内存管理机制、深拷贝与浅拷贝

🍉 CSDN 叶庭云:https://yetingyun.blog.csdn.net/ 一、对象和引用、内存管理机制 Python 中的一切都是对象,包括数字、字符串、列表和函数等。为了简化内存管理并提高效率,Python 采用了统一的对象模型。在这个模型中&#xff0c…

【考研数学】看张宇的书,高效自学攻略

张宇老师的课程,我建议还是认真听一下 因为张宇老师视频课并不是照本宣科的读讲义,他是真的有自己的教学方法 讲义上的概念,老师自己会在A4纸上带大家过一遍,并且遇到关键的知识点,老师会强调 张宇老师还会帮我们记…

C语言入门算法——车站

题目描述: 火车从始发站(称为第 1 站)开出,在始发站上车的人数为 a,然后到达第 2 站,在第 2 站有人上、下车,但上、下车的人数相同,因此在第 2 站开出时(即在到达第 3 站…

[C语言][数据结构][链表] 双链表的从零实现!

目录 零.必备知识 0.1 一级指针 && 二级指针 0.2 双链表节点的成员列表 a. 数据 b. 后驱指针 c. 前驱指针 0.3 动态内存空间的开辟 一. 双链表的实现与销毁 1.1 节点的定义 1.2 双向链表的初始化 && 创建新节点 1.3 尾插 1.4 头插 1.5 尾删 1.6 头删 1…

MySQL8.0.36-社区版:错误日志(2)

mysql有个错误日志,是专门记录错误信息的,这个功能默认是开启的 一般都是在/var/log/mysqld.log 日志中存放 1.错误日志的位置 首先我们使用命令去查看一下,这个错误日志文件究竟在哪 进入到mysql中,使用命令 show variables…

题目:输入数组,最大的与第一个元素交换,最小的与最后一个元素交换,输出数组。

题目:输入数组,最大的与第一个元素交换,最小的与最后一个元素交换,输出数组。 There is no nutrition in the blog content. After reading it, you will not only suffer from malnutrition, but also impotence. The blog conte…

二叉树遍历(前序创建|中序遍历)

牛客题目链接 目录 1.解题思路 1.1中序遍历打印 ​1.2前序创建二叉树 1.3注意点 博主这里用的是java实现 随手记一个知识: hasNext读取到空格或者换行符会结束 hasNextLine读取到换行符才会结束(空格不会退出) 为什么要强调这个呢? …

Vivado Design Suite中的增量实现和增量模式

Vivado Incremental(增量)是Xilinx FPGA设计工具中的一种功能,它允许对设计的一部分进行修改和重新编译,而不需要对整个设计进行重新编译。这种增量式的方法可以显著减少编译时间,特别是在进行小的修改或迭代开发时。 …

std::stringstream

std::stringstream 是 C 标准库中的一个类,用于对字符串进行输入输出操作,类似于文件流(std::ifstream 和 std::ofstream)。它允许你像使用 std::cin 和 std::cout 一样使用字符串。 std::stringstream 可以将字符串作为输入源&am…

ThreadPoolExecutor线程池解析

ThreadPoolExecutor线程池解析 一、ThreadPoolExecutor常见参数 jdk中Executors提供了几种常用的线程池,底层都是ThreadPoolExecutor。 public ThreadPoolExecutor(int corePoolSize,//核心线程数int maximumPoolSize,// 最大线程数long keepAliveTime,//非核心线程…

大数据产品有哪些分类?各类里知名大数据产品都有哪些?

随着互联网技术的持续进步和全球数字化转型的推进,我们正处于一个数据爆炸的时代。在这样的大背景下,大数据已经逐渐崭露头角,成为了推动各行各业发展的关键因素和核心资源。大数据不仅仅是指数据的规模巨大,更重要的是它蕴含的价…

安卓手机APP开发的媒体内容部分__重中之重的内容变现渠道___插入广告

安卓手机APP开发的媒体内容部分__重中之重的内容变现渠道___插入广告 目录 客户端的插入广告 声明式的广告的支持 有广告的播放列表 ExoPlayer IMA库 用户界面上的考虑 伴随广告 独立广告 使用第三方的广告SDK 服务器端的插入广告 ExoPlayer IMA库 用户界面上的考虑…