React打包之后的访问问题

最新推荐文章于 2024-08-22 10:37:35 发布
最新推荐文章于 2024-08-22 10:37:35 发布
阅读量2.8k 收藏 1
点赞数
分类专栏： 打包 文章标签： react
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hi335807829/article/details/101274958
版权

修改package.json文件

注意红色框框内的内容，

1、修改成 ".",则打包之后的文件可以直接双击打开index.html访问，

2、如果要放在tomcat容器中访问，则修改成"http://localhost:8080/aaa/"这种形式，tomcat路径下webapp文件夹内要有个aaa文件夹放项目文件

 

BlackTantou
关注
专栏目录
如何解决vue/react打包上线之后路由页面刷新就丢失的问题
Debug的博客
07-26 1174
location /{ try_files $uri /index.html; index index.html index.htm index.php; } 通过服务器的nginx配置进行url重写到程序入口index.html,代码如上
react 打包体积过大_彻底解决 webpack 打包文件体积过大问题
weixin_36049183的博客
12-23 959
webpack 把我们所有的文件都打包成一个 JS 文件，这样即使你是小项目，打包后的文件也会非常大。下面就来讲下如何从多个方面进行优化。去除不必要的插件刚开始用 webpack 的时候，开发环境和生产环境用的是同一个 webpack 配置文件，导致生产环境打包的 JS 文件包含了一大堆没必要的插件，比如 HotModuleReplacementPlugin, NoErrorsPlugin... ...
react打包后线上访问项目此请求已被阻止;内容必须通过HTTPS提供。
周家大小姐
12-08 2493
postActions.js:7 Mixed Content: The page at 'https://zhouyunfang.github.io/react-redux/index.html' was loaded over HTTPS, but requested an insecure resource 'http://jsonplaceholder.typicode.com/posts'...
react-router打包后无法通过路由进入到页面
weixin_30542079的博客
06-06 2021
react-router打包后无法通过路由进入到页面，是因为当我们使用react-router-dom里的BrowserRouter as Router时，是用浏览器history对象的方法去请求服务器， 如果服务器没有相对于的路由去指向对应的页面路由会找不到资源。 BrowserRouter会变成类似这样的路径 http://111.230.139.105:3001/detail/9459...
React布署打包到服务器上后，页面显示空白
最新发布
u011714807的博客
08-22 391
react项目路由用的是BrowserRouter，部署打包到服务器后打开报错或显示空白，可以参考以下解决问题方法。
React 打包后白屏，资源找不到
LueLueLue77的博客
07-28 1404
记录下最近在打包react项目的时候遇到页面白屏，资源找不到的情况
React-Router做路由，打包出来的静态文件丢到Tomcat里路由不生效，刷新页面404两个错误
qssn的博客
02-07 5361
有些开发er可能会想把做好的react项目，打包出来的静态文件丢到tomcat上测试，然后发现自己的路由怎么不生效了？？ 页面不进行加载了。  第二个就是但是当我们刷新一下浏览器，或者打开一个不存在的页面的时候 路由不加载（都是路径惹的祸）  首先，看一下自己的本地路径是不是这个样子的： http://localhost:8888/home 然而丢到tomcat的webap
vite打包后静态页面无法访问
weixin_43110440的博客
05-20 4542
vue3使用vite开发，效率会快很多，但是打包后就会遇到问题，vite的打包后的文件是需要部署到服务器才可以查看，但是很多时候我们的页面会有直接用静态页面去给人看的情况，这个时候vite就不可以了。 通过配置vite.config.js可以处理部署后查看白屏的问题，但是静态页面不行，因为js部分使用的是model的方式引入。网上找了很久，看vite的官网也看了很久，最后放弃了，使用cil的方式重建了一个项目，然后把代码移植过去，这其中有些地方需要注意，主要是eslint的配置 通过修改.eslintrc.
react打包成html5,create-react-app项目打包相关问题
weixin_35073484的博客
06-20 906
Q1. yarn build打包生成的文件直接点击index.html报错，打不开，导致的问题是yarn build打包生成的文件部署到服务器时只能在服务器根目录，如果在其他文件夹里面会报错A1:默认情况下，index.html中引入js和css的方式是，需要在本地启一个服务器才行，即在打包文件根目录下打开命令行，输入http-server，即可通过localhost:8080来访问到项目。解决办...
基于react项目打包css引用路径错误解决方案
01-18
执行npm start 一切正常, 但是 npm run build 之后生成的打包文件只能在根目录访问 这样放在服务器目录就访问不到了 报错为 手动更改index.html的路径之后又报静态资源引入错误 报错 解决方案 解决： 在...
React打包后，在NodeJS Express服务器中，前端JS失效问题
ZHANG DING的博客
03-26 1917
React打包后，在NodeJS Express服务器中，前端JS失效问题 本文前端：react为基础的Ant Design套件，官方地址：Ant Design 本文后端：Node.JS Express服务器 问题 在使用npm run build之后，得到压缩之后的release版本js及css代码。 将此压缩代码，放置于后端的服务器中，使其成为 静态资源 被HTML页面引用加载。...
【已解决】React打包访问静态页面空白
云烟飘渺00博客
12-24 1797
一、问题描述 使用WebStore新建的React项目，新建之后打包，我想访问页面，但是访问页面是空白 如图所示什么都没有，结果查看前段F12查看到是因为页面JS没有加载导致的 二、增加配置 在项目的 package.json添加 "homepage": ".", 重新打包即可 npm run build 重新打开页面即可 ...
vite项目本地打包以后预览报错
weixin_43773663的博客
02-10 1225
进入打包后的文件夹，打开终端!简单解决办法： 全局安装服务支持 http-sever ，安装后若不配置环境变量，需要使用http-server命令，也可以自己去配置环境变量，此处省略配置方法。vite创建的项目，打包后的文件本地预览报错，原因是file文件不支持import，需要开启个服务。http-server -p 8090 // 8090为自己设置的端口号，不要跟之前打开的冲突即可。输入下方命令行，开启一个服务，端口号设置不冲突即可。
react项目打包后点击index.html页面出现空白
qq_40436793的博客
12-19 1114
【问题描述】使用npm run build打包react项目后，index.html页面出现空白 【原因】出现该情况可能是因为找不到资源 【解决办法】在package.json中配置homepage，然后重新打包即可
vite+react+antd开发项目遇到的问题及解决方法（一）
qq_43753654的博客
03-22 1524
-----在使用BrowserRouter时，如果你的服务器配置正确，那么所有路径都可以正确匹配到页面，因为它使用真实的URL路径来进行匹配。相反，如果使用HashRouter，则只能匹配到“/”和“*”路径，因为这是Hash Router的默认行为。-----Browser Router使用HTML5的history API来实现，它使用真实的URL路径来匹配路由和渲染页面。------如果你想使用Hash Router来实现路由，建议检查一下你的服务器配置是否正确，因为Hash。
基于react、vite搭建项目遇到的坑
coco723的博客
03-17 487
检查您的hosts文件是否正确配置。您可以在计算机上搜索“hosts”文件并打开它，然后检查是否有任何条目将“localhost”映射到错误的IP地址。如果您使用代理服务器，可以尝试禁用它并重启开发服务器，以查看是否解决了问题。确保您的本地DNS配置正确。您可以尝试使用其他网络连接或在本地网络配置中更改DNS服务器。从控制台可以看出这个错误通常是由于本地DNS配置问题导致的。尝试在开发服务器的配置中使用IP地址而不是“localhost”。一步步检查下来，按第4点，问题得以解决；当启动本地服务的时候；
vue项目打包上传OSS，无法浏览，页面为空白
weixin_42418774的博客
07-20 1592
需求： vue项目命令打包：npm runbuild 生成dist文件，但是dist文件下的index.html打开是空白页，上传到OSS上也是如此 一、解决办法 在config/index.js目录下修改路径 二、解决办法 在webpack.base.conf.js中修改publicPath 三、解决方法 由于把路由模式mode设置成history了，默认是hash。 解决方法：路由里边router/index.js路由配置里边默认模式是hash，如果你改成了history模..
关于React+umi项目打包上线后，服务器访问不到页面空白问题
weixin_52277438的博客
02-28 1128
关于React+umi项目打包上线后，服务器访问不到页面空白问题。1.检查config文件里。
React项目本地环境正常显示，打包部署服务器图片不显示问题
objctly的博客
04-04 5926
React项目部署服务器，图片不显示
web应用打包之后部署到Nginx
05-18
如果你使用的是Vue、React等框架，可以使用以下命令进行打包： ``` npm run build ``` 打包完成后，在`dist`文件夹中可以找到打包好的应用文件。 6. 访问应用 在浏览器中输入你的域名，应该可以看到你部署好的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值