React-antd 打包后页面空白解决方案

最新推荐文章于 2024-09-26 09:59:22 发布

SnowBeatRain

最新推荐文章于 2024-09-26 09:59:22 发布

阅读量6.7k

点赞数

CC 4.0 BY-SA版权

分类专栏： react

本文链接：https://blog.youkuaiyun.com/SnowBeatRain/article/details/81097876

react 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了解决React项目中使用BrowserHistory遇到的问题，并提供了一个简单的解决方案，即通过hashHistory替代BrowserHistory来避免服务器支持的需求。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在根目录下打开可以在别的资源目录下打开空白：

import { BrowserRouter } from 'react-router'

因为BrowserHistory 需要服务器的支持。改成hashHistory完美解决
和vue-cli的history类似，

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

SnowBeatRain

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

前端 React.js 项目的性能优化的成功案例分析

AI架构全栈开发实战笔记

04-26

899

本文旨在通过真实项目案例，揭示 React 性能优化的核心逻辑与工程实践细节。首屏加载性能优化（含资源加载、HTML 体积、渲染阻塞）复杂交互组件的渲染效率优化（长列表、动态表单、图表组件）构建工具链深度调优（Webpack/Rollup 配置、Tree Shaking、代码压缩）服务器端渲染（SSR）与静态站点生成（SSG）的工程化实践React 组件优化策略（React.memo、useCallback、useMemo 的正确使用）核心概念。

react与antd结合使用实现分页打印功能以及插件;

weixin_45343326的博客

10-22

2919

下载 npm install --save react-to-print; 引用 import ReactToPrint from ‘react-to-print’; //触发按钮 <ReactToPrint trigger={() => <a href="#">点此打印</a>} conten...

参与评论您还未登录，请先登录后发表或查看评论

React 打包后部署到服务器子页面空白问题

Spenan

11-21

2960

执行npm run build 将React打包后部署到服务器子路径例如更目录为root 子路径为system --root --system 发现部署到服务器之后，F12开发者模式发现资源文件引用错误步骤(1):在项目package.json 添加 "homepage":'.'; 或者在node_modules->react-scripts->...

ant design pro 打包空白_给你代码：ant-desgin-vue使用

weixin_39918690的博客

11-25

662

ant design pro build 部署空白问题

zyzhan

03-02

1573

ant design pro build 部署空白问题在ngnix中加入伪静态配置即可解决 /src/router/index.ts 使用HASH则不用配置 location / { # 用于配合 browserHistory使用 try_files $uri $uri/ /index.html; # 如果有资源，建议使用 https + ...

antd出现空白列问题解决

我还可以

03-08

1630

引发这种问题有两个原因：列太少，而且设置了宽度设置了固定头部或者尾部解决：删除width属性和fixed属性

react native白屏及性能优化

三少GG

07-25

8826

白屏Trick: http://liuyy.coding.me/2016/07/22/react-native/react-native_launch/ 给android端设置启动图为了解决这个问题，找了很多的资料，参考了 ReactNative安卓首屏白屏优化，也并没有解决掉启动慢点问题，原因是全react-native的应用，内存换效率的做法并不起作用。于是我决定曲线

Electron+React+Antd将网页打包成应用程序完整步骤（electron-builder （搭建热更新）或 electron-packager（不搭建热更新））

weixin_41888177的博客

08-22

1万+

一、创建React项目 ps：由于写的时候没注意，包安装有的用npm有的用yarn。大家统一用一个就行。尽量不要使用cnpm。 ps：源码地址： git clone https://github.com/Aug-Sunrise/electron-test.git https://github.com/Aug-Sunrise/electron-test/tree/master 1、首先我...

从零开始使用webpack(4.x)+bable+react+ant-design配置单页面应用开发环境（附模板）

追逐丶的博客

02-22

1194

从零开始使用webpack+react+antd搭建web项目（附模板）前言准备工作1 建立项目目录2 安装webpack3 准备项目文件结构二配置webpack的工作1 基础配置2 配置webpack-dev-server三使用React开发页面四使用Webpack、Babel和React开发页面1 生成我们的html功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图......

企业级UI设计语言与React组件库：ant-design 4.15.2版特性解析

Ant Design 是一个企业级的 UI 设计语言和 React 组件库，主要为开发者提供一套完整的中后台产品解决方案。该库不仅提炼了企业级中后台产品的交互语言和视觉风格，而且还提供了众多开箱即用的高质量 React 组件，...

Ant Design 4.23.6：企业级UI组件库的React组件集

ant-design 是一个基于 React 的 UI 设计语言和组件库，旨在为开发者提供一套企业级的解决方案，以便他们能够快速构建出美观、一致且具有高可用性的用户界面。ant-design 提供了一套丰富的 React 组件，这些组件从...

React项目build打包后，页面空白的解决方案

苍老师背后的男人

08-23

3210

页面虽然可以正常访问，但如果在地址栏直接输入URL 回车，就会变成404页面的。这种情况没关系，当你最后把项目部署到正式服务器上时，在nginx中配置以下代码即可。重新 build 之后，启用本地服务打开 index.html 文件（本文中用 Live Server 插件启用本地服务，你也可以用其它的），如下图所示。React项目执行 build 命令后，在本地服务器打开页面。下的 package.json 文件，添加如下代码。打开后，页面可正常访问，如下图所示。

antd-pro部署后出现首次登录进入白屏

最新发布

tree_ge的博客

09-26

502

发现这个问题的项目package.js（新版本antd-pro没发现问题）解决：在config下condig.ts中改下路由配置为hash。打开控制台，看到个umi的报错。

react ant design pro用yarn build打包后加载不出来效果的解决办法

qq_46665317的博客

09-02

961

最近在做一个从0开始的react项目，我们要做一个后台管理系统，然后需要打包成可执行的.exe文件和.apk文件，能在windown系统和Android系统都能运行，然后我发现在打包antd pro 项目的时候一直有问题找不到资源，我就在网上找了很多资料，最后解决了，下面分享一下我的解决办法。

vue引入ant Design报警告并且页面空白不显示

y2745818985的博客

12-05

1064

vue引入ant Design报警告并且页面空白不显示

Vue使用动态路由加载菜单，部署上线后项目无报错，但页面空白（已解决！）

Java是世界上最好的语言.c

09-14

2471

Vue部署上线后，页面空白，无报错

react项目打包后点击index.html页面出现空白问题

YHjmonkey的博客

01-10

5530

在打包之前,在package.json中private下(位置任意)添加"homepage": "./" 这样在你点击index.html时候路径没有问题不会报错,但是页面可能还是空白的然后将项目中的引用路由时候的BrowserRouter改为HashRouter,所有用到的地方都要改然后执行npm run build 在点开index.html就不会报错 ...

react在部分安卓手机浏览器无法加载页面或页面空白

WKing

06-03

3717

公司有一套自己开发的管理系统，因为使用的人少，虽然一直有很多浏览器兼容的bug，但是因为偷懒（说白了因为这些bug自己没遇到过，没感受过，反正不影响自己）一直没处理，遇到bug的人群就喊他们去用chrome浏览器去直接在QQ或者微信里直接打开，终于有一天由于一项新业务不得不使用手机默认浏览器进行打开，自己也遇到了这个bug不得不想办法开始解决，so，一阵百度猛如虎（为啥不用google？翻墙懒得找...

React项目npm run build打包上线后，页面出现空白的原因