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. 4天带你上手HarmonyOS ArkUI开发——《HarmonyOS ArkUI入门训练营之健康生活实战》

     <HarmonyOS ArkUI入门训练营之健康饮食应用>是面向入门开发者打造的实战课程系列.特邀华为终端BG高级开发工程师作为本次训练营讲师,以健康饮食为例,开展技术教学及实战案例分享 ...

  2. Groovy反序列化链分析

    前言 Groovy 是一种基于 JVM 的开发语言,具有类似于 Python,Ruby,Perl 和 Smalltalk 的功能.Groovy 既可以用作 Java 平台的编程语言,也可以用作脚本语言 ...

  3. 混合app 解决常见bug弹出键盘返回出现闪屏

    前言 在我们开发混合app中,我们会发现一个问题,那就是比如我们正在输入信息的时候,然后我们按导航的返回键返回,因为切页面和回收键盘是同时的,给人一种闪屏的感觉,那么怎么解决呢? 方案 以ionic为 ...

  4. c# 解决死锁问题Monitor

    前言 在高并发中,一个很关键的问题就是要避免死锁. 那么为什么会产生死锁呢?这种情况多见吗? 举一个例子: 比如方法一中先lock(object1),在lock(object1)中lock(objec ...

  5. Oracle sql 判断全角字符

    (lengthb(MC) - length(MC))<>(lengthb(to_single_byte(MC)) - length(to_single_byte(MC)))

  6. 【hibernate】使用HQL对页面进行时间校验操作(预约)

    [hibernate]使用HQL对页面进行时间校验操作(预约) 预约系统中的时间校验 正好接了一个预约的需求,还需要用java 7和hibernate 1.时间冲突,时间段不能重复,在保存前对数据库进 ...

  7. EMT4J——让 Java 应用升级更轻松

    简介: EMT4J 是什么?如何使用 EMT4J 工具进行 Java 应用升级? 前言 JDK 升级对于 Java 应用来说是不得不面对的事情,一方面 Java 生态系统希望 Java 应用能跟上最新 ...

  8. Flink CDC 2.0 正式发布,详解核心改进

    简介: 本文由社区志愿者陈政羽整理,内容来源自阿里巴巴高级开发工程师徐榜江 (雪尽) 7 月 10 日在北京站 Flink Meetup 分享的<详解 Flink-CDC>.深入讲解了最新 ...

  9. 基于MaxCompute分布式Python能力的大规模数据科学分析

    ​简介: 如何利用云上分布式 Python 加速数据科学. 如果你熟悉 numpy.pandas 或者 sklearn 这样的数据科学技术栈,同时又受限于平台的计算性能无法处理,本文介绍的 MaxCo ...

  10. [Go] 有了 cast 组件, golang 类型转换从此不再困扰

    在 golang 中,参数和返回值之间往往涉及 int.string.[].map 等之间的转换. 如果是手动去处理,一容易出错,二不能兼容多数类型,比较麻烦. 使用 cast,能够让代码更健壮.可维 ...