使用vue项目,线上部署的时候,访问首页以及通过路由打开二级页面没有问题,但是一刷新就出现404现象

因为刷新页面时访问的资源在服务端找不到,因为vue-router设置的路由不是真实存在的路径。

解决办法是:在nginx.conf配置修改如下:

location / {
  root html;
  try_files $uri $uri/ @router;
  index index.html index.htm;
}

location @router {
  rewrite ^.*$ /index.html last;
}

红色字体是添加的配置,然后保存重启nginx即可解决。

vue-router+webpack线上部署时单页项目路由,刷新页面出现404问题的更多相关文章

  1. Vue Router 常见问题(push报错、push重复路由刷新)

    Vue Router 常见问题 用于记录工作遇到的Vue Router bug及常用方案 router.push报错,Avoided redundant navigation to current l ...

  2. Vue 部署单页应用,刷新页面 404/502 报错

    在 Vue 项目中,可以选择 hash或者 history.pushState() 实现路由跳转.如果在路由中使用history模式: export default new Router({ mode ...

  3. Docker实战 | 第三篇:Docker安装Nginx,实现基于vue-element-admin框架构建的项目线上部署

    一. 前言 在上一文中 点击跳转 通过IDEA集成Docker插件实现微服务的一键部署,但 youlai-mall 是前后端分离的项目,除了后端微服务的部署之外,当然还少不了前端工程的部署.所以本篇讲 ...

  4. Node+mongodb线上部署到阿里云

    Node+mongodb线上部署到阿里云 部署使用的主要工具是pm2+nginx,使用码云的私有仓库,自动部署到服务器,私有仓库和服务器要事先设置好免密码登录.使用DNSPOD进行域名解析.事先准备好 ...

  5. 【Maven篇】---解决Maven线上部署java.lang.ClassNotFoundException和no main manifest attribute解决方法

    一.前述 maven 线上部署的话会出现一些问题比如java.lang.ClassNotFoundException或者no main manifest attribute的话,是因为maven 配置 ...

  6. 关于docker线上部署时间问题

    背景 公司线上部署采用docker swarm方式,这几天线上项目时间突然出了问题(ps:第一反应,我去,这也能出问题,代码里肯定藏毒了),线上时间总跟实际时间差八个小时.本着速战速决的原则,把所有时 ...

  7. FastAdmin 线上部署流程 (2018-05-03 更新)

    FastAdmin 线上部署流程 首次部署 建立 git 环境. 建立 composer 环境. 建立 bower 环境. 将远程项目代码 git clone 到服务器上. 执行 composer i ...

  8. Django线上部署教程:腾讯云+Ubuntu+Django+Uwsgi(转载)

    网站名称: 向东的笔记本 本文链接: https://www.eastnotes.com/post/29 版权声明: 本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议.转载请注明出处! ...

  9. Node线上部署管理器PM2

    PM2是一个带有负载均衡功能的Node应用的进程管理器.PM2可以利用服务器上的所有CPU,并保证进程永远都活着,0秒的重载,部署管理多个Node项目.PM2是Node线上部署完美的管理工具. PM2 ...

随机推荐

  1. multi cookie & read bug

    js cookie multi cookie & read bug document.cookie; // "access_token_test=eyJhbGciOiJIUzI1Ni ...

  2. 【区间dp+组合数+数学期望】Expression

    https://www.bnuoj.com/v3/contest_show.php?cid=9148#problem/I [题意] 给定n个操作数和n-1个操作符,组成一个数学式子.每次可以选择两个相 ...

  3. KSQL日期字段访问

    日期常量用法 KSQL中用日期常量必须用{ts'" + dateTime.ToString("yyyy-M-d HH:mm:ss") + "'} 正确写法: I ...

  4. PatentTips – EMC Virtual File System

    BACKGROUND OF THE INVENTION 1. Field of the Invention The present invention generally relates to net ...

  5. Thinkphp5.0 的使用模型Model删除数据

    Thinkphp5.0 的使用模型Model删除数据 一.使用destory()删除数据 //删除id为3的记录 $res = User::destroy(3); //返回影响的行数 dump($re ...

  6. Codeforces 651D Image Preview【二分+枚举】

    题意: 若干张照片,从头开始可以向左右两边读,已经读过的不需要再读,有的照片需要翻转,给定读.滑动和翻转消耗的时间,求在给定时间内最多能读多少页? 分析: 首先明确,只横跨一次,即先一直读一边然后再一 ...

  7. 作为一名CEO

    你 不能怕得罪人 不能奢望完成工作的时候 有太多的愉悦感 你 必须要去做左右为难但左右亦可的 操蛋决策 你 得脸皮够厚 肚囊儿宽超 什么事情都能快速消化 哪怕 是 一坨屎 你 还得 决不放弃 永不言败 ...

  8. no matching function transform?

    http://stackoverflow.com/questions/19876746/stdtolower-and-visual-studio-2013 http://forums.codeguru ...

  9. Moravec算子

    Moravec在1981年提出了Moravec角点检測算子,并将它应用于立体匹配.它是一种基于灰度方差的角点检測方法.该算子计算图像中某个像素点沿着水平.垂直.对角线.反对角线四个方向的灰度方差,当中 ...

  10. Mesos, Marathon, Docker 平台部署记录

    Mesos, Marathon, Docker 平台部署记录 所有组件部署基于Ubuntu 14.04 x64 主机 IP 角色 master 192.168.1.3 Mesos Master, Ma ...