由于BrowserHistory访问的是文件真实地址
不仅需要前端配置package.json
还需要运维端配置一下网站Nginx设置
环境：

"react": "^17.0.2",

"react-dev-utils": "^11.0.4",

"react-dom": "^17.0.2",

"react-router": "^5.2.0",

"react-router-dom": "^5.2.0",

前端package.json配置如下

此外，本地开发你设置"homepage":"./"都能打开，二级地址也可以正常跳转，是webpack dev server里已经做好了配置

Nginx只配置try_files不能完全起作用（次级地址）

需要前端打包的时候配置一下

nginx配置如下

如果你的404页面也是一个单独组件页面的话

在errorpage 404 的页面改为 ../index.html（你的入口html文件）

更多文章请移步我的个人博客，同时我也会加速迁移文章。https://blog.nwctwang.top/

React BrowserHistory 踩坑实录 布置到服务器Nginx上各种静态文件、二级地址404的更多相关文章

  1. 『vue踩坑日常』 在index.html中引入静态文件不生效

    Vue日常踩坑日常 -- 在index.html中引入静态文件不生效问题 本文针对的是Vue小白,不喜勿喷,谢谢 出现该问题的标志如下 控制台warning(Resource interpreted ...

  2. ffmpeg 踩坑实录 添加实时水印（二）

    一.背景介绍 最近领导要求做一个视频录制的相关项目.其中,需要对视频文件进行添加 实时时间水印.于是,我想到了使用之前的ffmpeg来做. 二.ffmpeg实际操作 首先把需要添加水印的视频文件,上传 ...

  3. 后端路由项目由 gulp 改为 webpack 的踩坑实录

    前言 公司有个后端路由的项目是用 gulp 作为前端自动化构建工具,最近学习了一下 webpack,深感其强大,一狠心将其改成了 webpack 构建,以下是踩坑实录. gulp 先来说说原来的架构. ...

  4. JAVA实用案例之文件导出（JasperReport踩坑实录）

    写在最前面 想想来新公司也快五个月了,恍惚一瞬间. 翻了翻博客,因为太忙,也有将近五个多月没认真总结过了. 正好趁着今天老婆出门团建的机会,记录下最近这段时间遇到的大坑-JasperReport. 六 ...

  5. JasperReport报表导出踩坑实录

    写在最前面 翻了翻博客,因为太忙,已经好久没认真总结过了. 正好趁着今天老婆出门团建的机会,记录下最近这段时间遇到的大坑-JasperReport. 六月份的时候写过一篇利用poi文件导入导出的小De ...

  6. React Native之React Navigation踩坑

    自动重装系统之后,已经很长一段时间没有来写React Native了,今天空闲之余,决定重新配置React Native的开发环境,继续踩坑... React Native的开发环境配置狠简单,只要依 ...

  7. react学习 | 踩坑指南

    react样式模块化的"omit -loader"坑 众所周知 react样式的模块化(css modules) 是自己模块中写自己的css,与其他模块互补影响,解决了命名冲突和全 ...

  8. React Native踩坑日记 —— tailwind-rn

    项目背景 在项目的初始阶段,我们需要建立自己的design system,我们spike了一些方案,tailwind-rn就是其中一种,如果有用到或者即将用到tailwind-rn的,可以进来看一看, ...

  9. ffmpeg 踩坑实录 安装与视频切片（一）

    这段时间一直在做一个关于视频处理的项目.其中有一块需要切片相关功能.于是采用了ffmpeg来完成相关需求. 第一,ffmpeg的安装. 首先下载官方包,我这里用的是ffmpeg-release-64b ...

随机推荐

  1. java中求一下2008年5月31日， 往前倒30天是哪天？

    题目9: 2008年5月31日, 往前倒30天是哪天?  import java.util.*; public class Test {     public static void main(Str ...

  2. js判断时间格式不能超过30天

    let first = this.data.date //开始时间 let second = e.detail.value //结束时间 var data1 = Date.parse(first.re ...

  3. [ Skill ] 为什么 Lisp 语言如此先进

    https://www.cnblogs.com/yeungchie/ 网上看到一个应该是 2002 年的文章 译文转自:为什么Lisp语言如此先进?(译文) - 阮一峰的网络日志 原文地址:Reven ...

  4. js知识梳理6:关于函数的要点梳理(2)(作用域链和闭包)

    写在前面 注:这个系列是本人对js知识的一些梳理,其中不少内容来自书籍:Javascript高级程序设计第三版和JavaScript权威指南第六版,感谢它们的作者和译者.有发现什么问题的,欢迎留言指出 ...

  5. SSRF——介绍利用（不全）

    1. SSRF介绍 SSRF(Server-side Request Forge, 服务端请求伪造). 由攻击者构造的攻击链接传给服务端执行造成的漏洞,一般用来在外网探测或攻击内网服务. 2. SSR ...

  6. Color Constancy 颜色恒定性

    1:Color Constancy? 世界上并不存在颜色.颜色仅仅是我们的眼睛和大脑对不同可见光的波长进行的一层映射.也就说颜色只是我们大脑和视网膜处理的结果. 1.1 关键问题 我们的视觉系统有一个 ...

  7. React 日常记录

    以下是学习重点 原文地址 浏览器环境 JS解析和执行.绘制.事件处理.静态资源加载和处理 GUI渲染线程和Javascript线程 调度策略 先到先得(FCFS) 对短进程不利 对I/O密集不利 单处 ...

  8. Java语言学习day17--7月23日

    1.面向对象思想2.类与对象的关系3.局部变量和成员变量的关系4.封装思想5.private,this关键字6.随机点名器 ###01面向对象和面向过程的思想 * A: 面向过程与面向对象都是我们编程 ...

  9. Blazor Bootstrap 组件库地理定位/移动距离追踪组件介绍

    地理定位/移动距离追踪组件 通过浏览器 API 获取定位信息 DEMO https://www.blazor.zone/geolocations 小提示 注意: 出于安全考虑,当网页请求获取用户位置信 ...

  10. Java类型跟数据库类型的相互转换

    1.自定义一个转换类型,获取数据库数据并输出数据时,把数据库的Varchar类型转为java的String[]类型 前提(1) 定义一个类VarcharToStringsHandler继承BaseTy ...