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 服务器的更多相关文章

  1. VUE路由history模式坑记--NGINX

    因微信分享和自动登录需要,对于URL中存在'#'的地址,处理起来比较坑(需要手动写一些代码来处理).还有可能会有一些隐藏的问题没被发现. 如果VUE能像其他(JSP/PHP)系统的路径一样,就不存在这 ...

  2. K8s nginx-ingress 如何配置二级目录转发远程静态服务器基于Vue路由history模式打包的应用程序

    背景 首先这标题有点绕,我先解释下: 首先我们有静态服务器,上面某个目录有Vue路由history模式打包的应用程序(也就是build后的产物): 但是静态服务器一般不做对外域名用的,我们需要在k8s ...

  3. Vue路由history模式踩坑记录:nginx配置解决404问题

    问题背景: vue-router 默认是hash模式,使用url的hash来模拟一个完整的url,当url改变的时候,页面不会重新加载.但是如果我们不想hash这种以#号结尾的路径时候的话,我们可以使 ...

  4. 新来的前端小姐姐问:Vue路由history模式刷新页面出现404问题

    摘要:vue-router 默认 hash 模式 -- 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载. 本文分享自华为云社区<学习Vue Rou ...

  5. vue react 路由history模式刷新404问题解决方案

    vue单页因微信分享和自动登录需要,对于URL中存在’#’的地址,处理起来比较坑.用history模式就不会存在这样的问题.但是换成history模式,就会有个新的问题,就是页面刷新后,页面就无法显示 ...

  6. vue路由history模式刷新页面出现404问题

    vue hash模式下,URL中存在'#',用'history'模式就能解决这个问题.但是history模式会出现刷新页面后,页面出现404.解决的办法是用nginx配置一下.在nginx的配置文件中 ...

  7. vue路由history模式下打包node服务器配置

    vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载. 如果不想要很丑的 hash,我们可以用路由的 his ...

  8. vue项目的mode:history模式

    最近做的Vue + Vue-Router + Webpack +minitUI项目碰到的问题,在此记录一下,Vue-router 中有hash模式和history模式,vue的路由默认是hash模式, ...

  9. vue cli3 项目配置

    [转]https://juejin.im/post/5c63afd56fb9a049b41cf5f4 基于vue-cli3.0快速构建vue项目 本章详细介绍使用vue-cli3.0来搭建项目. 本章 ...

  10. vue-cli3.x正确打包项目,解决静态资源与路由加载无效的问题,history模式下配合使用nginx运行打包后的项目

    使用vue-cli3.x正确打包项目,配合nginx运行打包后的内容 vue.config.js module.exports = { publicPath: './',//打包后的位置(如果不设置这 ...

随机推荐

  1. Batch Normalization 和 DropOut

    Batch-Normalization https://www.cnblogs.com/guoyaohua/p/8724433.html 有几点需要注意: \(x^{(k)}\)指的是t层的输入. 也 ...

  2. mysql 重新整理——七种连接join连接[六]

    前言 总结一下其中join连接. 正文 又到了盗图时刻: 上面标记好了顺序. 第一种: select * from A a left join B b on a.key=b.key 这里解释一下,这里 ...

  3. burp suite历程-安装burp suite

    安装时,捯饬了快一上午,不是jdk高了就是装上后不好使了,后来看了下以下文章,安装成功,特此记录以备不时之需: 内容拷贝至链接:https://juejin.cn/post/6844904111867 ...

  4. iOS自动化打包命令xcodebuild大全

    iOS实现自动化打包已经稳定运营几年了,不同的场景用到xcodebuild命令不一样,有的参数可能一直都用不到,列举一些常用的命令,比如编译命令: xcodebuild archive -worksp ...

  5. 我是如何搭建ChatGPT并嵌入到微信公众号的?

    前言 体验方式:薇辛搜索 龚众号 [程序员Jason],关注并点击发消息,点菜单ChatGPT 然后翻到最下面点[阅读原文]就可以了. ChatGPT对某些国家是不提供服务的,所以一般是用不了,除非是 ...

  6. bs4、selenium的使用

    爬取新闻 # 1 爬取网页---requests # 2 解析 ---xml格式,用了re匹配的 ---html,bs4,lxml... ---json: -python :内置的 -java : f ...

  7. 力扣162(java&python)-寻找峰值(中等)

    题目: 峰值元素是指其值严格大于左右相邻值的元素. 给你一个整数数组 nums,找到峰值元素并返回其索引.数组可能包含多个峰值,在这种情况下,返回 任何一个峰值 所在位置即可. 你可以假设 nums[ ...

  8. 通过Jenkins构建CI/CD实现全链路灰度

    简介: 本文介绍通过 Jenkins 构建流水线的方式实现全链路灰度功能. 作者:卜比   本文介绍通过 Jenkins 构建流水线的方式实现全链路灰度功能. 在发布过程中,为了整体稳定性,我们总是希 ...

  9. MaxCompute 公共云多租户设计的技术要点详解及产品实现特色

    ​简介:公共云大数据平台在多租户的设计和实现方式上有所差异.本文主要介绍在公共云大数据平台的多租实现方案中需要考虑的问题和挑战,重点介绍了MaxCompute在计算和存储多租实现上的特点.期望通过这些 ...

  10. Service Mesh 从“趋势”走向“无聊”

    简介: 过去一年,阿里巴巴在 Service Mesh 的探索道路上依旧扎实前行,这种坚定并非只因坚信 Service Mesh 未来一定是云计算基础技术的关键组成部分,还因需要借这一技术趋势去偿还过 ...