vue-历史模式部署

项目部署

本项目采用nginx进行部署,历史模式的部署需要服务端的配合,本次采用nginx进行配合。
1 配置

const basePath = process.env.VUE_APP_BASE_PATH;
module.exports = {publicPath: basePath #静态资源的路径 /ecology/
}

2 创建路由

const createRouter = baseRouter => {const router = new VueRouter({#/ecology base: baseRouter || process.env["VUE_APP_BASE_PATH"].slice(0, -1),mode: "history",routes: [...constantRoutes, ...asyncRoutes]});return router;
};

3 nginx配置

location /ecology {root html;index index.html index.htm;#这个配置的含义为:当请求到这个路径下面时/ecology/main/overview 会首先去这个路径下访问index.html如果有则返回这个静态资源#如果没有 继续向后匹配 nginx内部重新定向到 /ecology/indexl.html 这样的话就相当于重定向到了首页,此时携带了路径参数/main/overview,就会触发vue路由的工作。其实这样也可以只写/ecology/index.html就已经完全足够。try_files  $uri $uri/  /ecology/index.html; 
}

http://11.2.19.11:8088/ecology/main/overview
$uri:/ecology/main/overview
$request_uri:http://11.2.19.11:8088/ecology/main/overview
try_files: 官方文档

特别注意的是:静态资源路径,路由路径和nginx Location的路径一定要保持一致。

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

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

相关文章

3D模型顶点颜色转纹理【SIMPLYGON】

在这篇博客中,我们将了解如何将顶点颜色烘焙到纹理中。 其用例是某些照片扫描资产,其中颜色数据保存到顶点颜色中。 我们将了解如何使用 remesher 和聚合器管道来完成此操作。 我们还将介绍如何为顶点颜色材质创建着色网络以及如何从模型后处理中删除顶点…

6.Spring源码解析-loadBeanDefinitions(String location)

这里resourceLoader其实就是ClassPathXmlApplicationContext 1.ClassPathXmlApplicationContext 在上文中图例就能看出来 获取资源组可能存在多个bean.xml 循环单独加载资源组 创建一个编码资源并解析 获取当前正在加载的资源发现是空 创建了一个字节输入流&#xff0c…

pytorch分布式训练

1 基本概念 rank:进程号,在多进程上下文中,我们通常假定rank 0是第一个进程或者主进程,其它进程分别具有1,2,3不同rank号,这样总共具有4个进程 node:物理节点,可以是一个…

Find My键盘|苹果Find My技术与键盘结合,智能防丢,全球定位

键盘是最常用也是最主要的输入设备,通过键盘可以将英文字母、汉字、数字、标点符号等输入到计算机中,从而向计算机发出命令、输入数据等。还有一些带有各种快捷键的键盘。随着时间的推移,渐渐的市场上也出现独立的具有各种快捷功能的产品单独…

单例模式-C++实现

目录 饿汉式懒汉式双检查锁,线程安全的版本什么是reorder?解决内存读写reorder不安全方法代码解释懒汉式的优缺点 单例模式是一种设计模式,用于确保一个类只有一个实例,并提供一个全局的访问点来获取该实例。它常用于需要在整个应…

【软考】模块的内聚类型

目录 一、偶然内聚二、逻辑内聚三、时间内聚四、过程内聚五、通信内聚六、顺序内聚七、功能内聚 一、偶然内聚 1.最弱的内聚类型 2.又称巧合内聚,模块的各个成分之间毫无关系 二、逻辑内聚 1.逻辑上相关的功能被放在同一个模块中 2.如一个模块读取各种不同类型外设…

QTextEdit 是 Qt 框架中的一个类,用于显示和编辑多行文本内容的可编辑部件

QTextEdit 是 Qt 框架中的一个类,用于显示和编辑多行文本内容的可编辑部件。 QTextEdit 提供了一个用于显示和编辑富文本(包括格式化文本、图像和链接等)和纯文本的文本编辑器。它支持基本的文本操作(如复制、粘贴、撤销、重做等…

自己动手实现一个深度学习算法——八、深度学习

深度学习是加深了层的深度神经网络。 1.加深网络 1)向更深的网络出发 创建一个如下图所示的网络结构的CNN 这个网络的层比之前实现的网络都更深。这里使用的卷积层全都是33 的小型滤波器,特点是随着层的加深,通道数变大(卷积…

FLASK博客系列7——我要插入数据库

我们来继续上次的内容,实现将数据插入数据库。 我们先更改下models.py,由于上次笔误,把外键关联写错了。在这里给大家说声抱歉。不过竟然没有小伙伴发现。 models.py from app import dbclass User(db.Model): # 表名将会是 user&#xff0…

针对无法创建JDK8版本的SpringBoot项目

自从昨日起,JDK突然改版了,不能在使用JDK8来进行创建Spring Boot项目了,导致目前小编的JDK无从下手~~ 因此,在仔细琢磨了一晚之后,想起来了以下几个方法,与大家共勉。希望能够得到大家的认可! …

生命科学领域 - 新药从研发到上市全流程

新药是指新研制的、临床尚未应用的药物,其化学本质应为新的化合物或称新化学实体、 新 分子实体、新活性实体。新药研发的根本目的是治疗疑难危重疾病,研制出来的药物即使是全新的化学结构,但是疗效或安全性却不及现有的药物便失去新药价值&a…

Redis面试题:哨兵模式相关问题,以及脑裂问题

目录 面试官:怎么保证Redis的高并发高可用 面试官:你们使用redis是单点还是集群,哪种集群 面试官:redis集群脑裂,该怎么解决呢? 面试官:怎么保证Redis的高并发高可用 候选人:首先…

人工智能-优化算法之凸集

凸性 凸性(convexity)在优化算法的设计中起到至关重要的作用, 这主要是由于在这种情况下对算法进行分析和测试要容易。 换言之,如果算法在凸性条件设定下的效果很差, 那通常我们很难在其他条件下看到好的结果。 此外&…

统信UOS安装Virtualbox虚拟机和Windows10系统

在UOS统信系统中部署Windows环境我可以通过安装虚拟机来实现,这也可以解决软件不适配带来的一些问题,当然对硬件配置也有一定的要求,不建议性能过低的设备使用。 接下来请按照以下步骤进行安装Virtualbox及Win10虚拟系统的设置。 1、安装Vi…

数字滚动vue-count-to

数字滚动 下载插件 npm i vue-count-to 使用 start-val 起始值&#xff0c;表示从什么值开始滚 end-val 终点值&#xff0c;表示要滚到多大值 duration 滚动事件&#xff0c;表示用多长时间来滚动 <countTo :start-val"0" :end-val"228" :duration&quo…

ETL+BI结合的数据集成工具

在当今信息化时代&#xff0c;企业积累了大量的数据资产&#xff0c;如何高效地提取、转换和加载&#xff08;ETL&#xff09;这些数据&#xff0c;并将其转化为有用的洞察力成为了企业取得竞争优势的关键。同时&#xff0c;商业智能&#xff08;BI&#xff09;作为一种数据驱动…

微软重磅更新:Bing Chat全线改名Copilot,用户可免费使用GPT4!(文末附Copilot使用教程)

原创 | 文 BFT机器人 微软在2023年的Ignite大会上宣布了许多新产品和功能。其中最引人注目的是Bing Chat更名为Copilot&#xff0c;Copilot基于最新的OpenAI模型&#xff0c;包括GPT-4和DALL・E 3&#xff0c;为用户提供文本和图像生成功能。也就是说&#xff0c;只要你拥有微…

Flutter 桌面应用开发之读写Windows注册表

文章目录 需求来源Windows查询Windows版本号方法1. 如何查看Windows版本号2. Windows开发如何通过代码查询Windows版本号(1) 使用C#代码&#xff1a;(2) 使用VB.NET代码 3.通过注册表查看Windows版本信息 Flutter查询Windows版本号方法依赖库支持平台实现步骤1. 在pubspec.yaml…

记一次mysql 锁表 的经历 : Lock wait timeout exceeded; try restarting transaction

场景&#xff1a;线程a 进行insert 操作&#xff0c;线程b 进行update 操作 。a 和b 都添加了事务。 报错&#xff1a;线程a insert 的时候 报锁等待超时 处理方式&#xff1a; 1。#查询是否锁表 show OPEN TABLES where In_use > 0; 2。#查询表被锁进程&#xff1b;查询到…

opencv-医学图像预处理

医学图像预处理通常需要针对特定任务和数据集的特点进行定制。以下是一些常见的医学图像预处理步骤&#xff0c;可以使用OpenCV以及其他相关库来实现&#xff1a; 导入相关的库 import cv2 import matplotlib.pyplot as plt1. 读取图像 image cv2.imread(r"C:\Users\m…