React项目打包本地空白问题

背景:当我使用npm run build打包后点开了build中的index.html一片空白,一脸懵,于是打开了控制台。发现以下报错。

问题1. 找不到manifest.json文件,于是打开了打包过后build中的index.html

<link rel="manifest" href="/manifest.json"/> 发现"/manifest.json" 前面少了一个 "."

于是我打开package.json 新增homepage:"."

再次打包,成功在manifest前加上"."

ps:如果homepage:"." 以后出现了/static/js 或者 /static.css 文件找不到可能是打包的缓存可清缓存再试或者使用craco.config 配置以下静态资源路径 './'即可

问题2. 再次打开index.html

额页面404了,于是检查了一下我的路由配置

我使用的是createBrowserRouter,想到我这个项目是H5嵌入到其它平台,不需要与服务端进行渲染(SSR),于是改为createHashRouter

再次打包,并打开index.html 页面渲染正常,问题解决。

相关推荐
皓月Code5 小时前
第二章、全局配置项目主题色(主题切换+跟随系统)
javascript·css·react.js·1024程序员节
楊无好21 小时前
react中的受控组件与非受控组件
前端·react.js
菠萝+冰21 小时前
react虚拟滚动
前端·javascript·react.js
明月与玄武1 天前
2025 前端框架决战:Vue 与 React 分析优缺点及使用场景!
前端·vue.js·react.js
举个栗子dhy1 天前
第四章、路由配置
前端·javascript·react.js
im_AMBER1 天前
React 03
前端·笔记·学习·react.js·前端框架·react
.生产的驴1 天前
React 集成Redux数据状态管理 数据共享 全局共享
前端·javascript·react.js·前端框架·css3·html5·safari
@PHARAOH2 天前
WHAT - 受控组件和非受控组件
前端·javascript·react.js
举个栗子dhy2 天前
第二章、全局配置项目主题色(主题切换+跟随系统)
前端·javascript·react.js
举个栗子dhy2 天前
第一章、React + TypeScript + Webpack项目构建
前端·javascript·react.js