vue-cli3 项目路由 history 模式部署到 nginx 服务器
1.项目修改
vue.config.js增加
publicPath: '/'
2.nginx配置
location / {#访问前端页面
root /data/dist;#vue项目存放路径
index index.html; #hash模式只配置访问html就可以了
try_files $uri $uri/ /index.html;#history模式配置否则会出现vue的路由在nginx中刷新出现404
}
vue-cli3 项目路由 history 模式部署到 nginx 服务器的更多相关文章
- VUE路由history模式坑记--NGINX
因微信分享和自动登录需要,对于URL中存在'#'的地址,处理起来比较坑(需要手动写一些代码来处理).还有可能会有一些隐藏的问题没被发现. 如果VUE能像其他(JSP/PHP)系统的路径一样,就不存在这 ...
- K8s nginx-ingress 如何配置二级目录转发远程静态服务器基于Vue路由history模式打包的应用程序
背景 首先这标题有点绕,我先解释下: 首先我们有静态服务器,上面某个目录有Vue路由history模式打包的应用程序(也就是build后的产物): 但是静态服务器一般不做对外域名用的,我们需要在k8s ...
- Vue路由history模式踩坑记录:nginx配置解决404问题
问题背景: vue-router 默认是hash模式,使用url的hash来模拟一个完整的url,当url改变的时候,页面不会重新加载.但是如果我们不想hash这种以#号结尾的路径时候的话,我们可以使 ...
- 新来的前端小姐姐问:Vue路由history模式刷新页面出现404问题
摘要:vue-router 默认 hash 模式 -- 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载. 本文分享自华为云社区<学习Vue Rou ...
- vue react 路由history模式刷新404问题解决方案
vue单页因微信分享和自动登录需要,对于URL中存在’#’的地址,处理起来比较坑.用history模式就不会存在这样的问题.但是换成history模式,就会有个新的问题,就是页面刷新后,页面就无法显示 ...
- vue路由history模式刷新页面出现404问题
vue hash模式下,URL中存在'#',用'history'模式就能解决这个问题.但是history模式会出现刷新页面后,页面出现404.解决的办法是用nginx配置一下.在nginx的配置文件中 ...
- vue路由history模式下打包node服务器配置
vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载. 如果不想要很丑的 hash,我们可以用路由的 his ...
- vue项目的mode:history模式
最近做的Vue + Vue-Router + Webpack +minitUI项目碰到的问题,在此记录一下,Vue-router 中有hash模式和history模式,vue的路由默认是hash模式, ...
- vue cli3 项目配置
[转]https://juejin.im/post/5c63afd56fb9a049b41cf5f4 基于vue-cli3.0快速构建vue项目 本章详细介绍使用vue-cli3.0来搭建项目. 本章 ...
- vue-cli3.x正确打包项目,解决静态资源与路由加载无效的问题,history模式下配合使用nginx运行打包后的项目
使用vue-cli3.x正确打包项目,配合nginx运行打包后的内容 vue.config.js module.exports = { publicPath: './',//打包后的位置(如果不设置这 ...
随机推荐
- CentOS6.4中yum命令安装php5.2.17[转载未亲测]
最近给公司部署服务器的时候发现他们提供的服务器是centos6.4系统的,装好系统和相关服务httpd,mysql,php,一跑代码,发现php5.3中的zend加密不能用,安装Zend Guard ...
- k8s 深入篇———— Job与CronJob[十]
开篇 简要演练一下job 和 cronjob 正文 实际上,它们主要编排的对象,都是"在线业务",即:Long Running Task(长作业).比如,我在前面举例时常用的 Ng ...
- shell脚本中的运算符和条件判断
shell脚本中的运算符和条件判断: 一.算术运算符 在Shell脚本中,你可以使用各种运算符来执行数学运算.比较和逻辑操作. 计算方式: $[ ] $(( )) 例: a=$[(9+5)90] 打印 ...
- easyx的使用 鼠标交互(3.1)
本文学习于B站,进行借鉴学习记录: 视频链接:鼠标操作(新版)_哔哩哔哩_bilibili 初始化调用文件头不再使用#include<graphics.h>,选择调用#include< ...
- DataX在数据迁移中的应用
简介: DataX在数据迁移中的应用 1. DataX定义 首先简单介绍下datax是什么.DataX是阿里巴巴集团内被广泛使用的离线数据同步工具/平台,实现包括 MySQL.Oracle.SqlSe ...
- [DApp] Moralis 无服务架构方式构建 DApp
Moralis 提供的使用功能包括三个方面: 进一步封装Web3功能的 Moralis SDK,极大方便了开发者对于DApp基础功能的开发,比如 MetaMask登录验证,签名,IPFS集成,DApp ...
- IphoneX(10) 重启/关机, 强制重启/关机
正常关机是同时长按 音量+ 和 右侧电源键,屏幕出现滑动按钮进行关机. 注意截图是同时短按 音量+ 和 右侧电源键. 强制关机是按照顺序按三个键:音量+ 音量- 长按右侧键 Other:苹果X怎 ...
- 2018-2-13-win10-uwp-右击选择-GridViewItem-
title author date CreateTime categories win10 uwp 右击选择 GridViewItem lindexi 2018-2-13 17:23:3 +0800 ...
- 《MySql必知必会》笔记整理
数据库基础 关键词: 数据库 表(表名唯一,取决多个因素,如不同数据库的表可以同名) 模式(关于数据库和表的布局及特性的信息) 列(表中的字段) 行[行(raw)和记录(record)很大程度可以等同 ...
- Raft 共识算法4-选举限制
Raft 共识算法4-选举限制 Raft算法中译版地址:https://object.redisant.com/doc/raft中译版-2023年4月23日.pdf 英原论文地址:https://ra ...