uniapp 编译H5项目部署tomcat,空白页

最新推荐文章于 2024-07-23 17:54:41 发布
最新推荐文章于 2024-07-23 17:54:41 发布
阅读量3.7k 收藏 11
点赞数 4
分类专栏： uniapp
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_37878579/article/details/106585405
版权

H5项目部署到服务器出现的问题

在这里插入图片描述Uniapp项目打包H5步骤：

  1. 点击菜单 发行->H5
    在这里插入图片描述
  2. 在当下项目下的unpackage/dist/build/h5目录找到出的资源，部署服务器（或者使用本地服务器预览，不要直接在浏览器打开html文件）。
  3. 访问时直接按照服务器路径访问，不需要加index.html

解决办法
首先在HbuilderX里点击【manifest.json】，然后选择【h5配置】，然后【路由模式】选择history模式（因为微信支付等场景不支持hash模式）
在这里插入图片描述
在这里插入图片描述
来来来敲黑板看下图
在这里插入图片描述

Pannahouse
关注
  • 4
    点赞
  • 踩
  • 11
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
Flutter web打包后,访问页面显示空白
路漫漫其修远
03-09 3005
原因 Flutter在运行和构建Web应用程序时，可以在两个不同的渲染器之间进行选择。 这两个渲染器是： HTML。CSS，Canvas元素和SVG元素。 该渲染器的下载大小较小。 Canvaskit。使用Skia编译为WebAssembly并使用WebGL渲染。 该渲染器与Flutter移动设备和台式机完全一致，具有更快的性能，并且不太可能在浏览器之间出现差异，但下载大小增加了大约2MB。 Flutter官方文档上对这个选项的默认设置的说明是 当应用程序在移动浏览器中运行时，此选项选择HTML渲染.
架构解密的读书笔记
知行合一 止于至善
09-17 3374
治辉的架构解密的第2版，上周在去北京的路上一边读一边做了一些笔记，涉猎广泛，由浅入深，循序渐进，非常推荐一读。
Vue在Tomcat部署下二级页面刷新404问题
fmyahxm的博客
09-25 2664
解决：在 webapps 文件下添加如下目录 在目录中填加文件 在xml文件中写入 <?xml version="1.0" encoding="UTF-8"?> <web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="ht...
centos7.2搭建nginx的web服务器部署uniapp项目
09-14
主要介绍了centos7.2搭建nginx的web服务器部署uniapp项目,本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
如何将uniapp发布到h5并部署
最新发布
克里斯蒂亚诺更新的博客
07-23 496
项目创建文件夹：（注意这里root html/**指的是 nginx的根目录）打包成功：（注意如果中途打包不成功失败了，就重启HBuilerX重新打包）注意manifest.json不要动。
uniapp通过tomcat将项目部署到本地服务器
m0_74289031的博客
05-10 731
提取码：i9sp解压缩后配置环境即可使用（因为主要讲的是uniapp，所以tomcat旧不多说了），安装配置好的tomcat运行起来默认是乱码，可以通过配置logging.properties来改变找到该文件，在下图中改变"UTF-8"为"GBK"再重新运行即可。
uniapp发布为h5 并且部署
yanyu0718的博客
10-16 349
发布 然后将文件上传到tomcat服务器里的webapps文件夹中即可
uniapp history路由配置，apache服务器简单配置（刷新报404解决方法）
似码非码的博客
05-18 3470
uniapp编译到h5端使用hash路由模式，url显得不太好看，但是选择history路由模式刷新页面会报404的错误，现在教大家简单配置服务器即可解决问题。 第一步、需要在hbuilder X里面配置一下路由模式选择history 第二步、发行h5端，把代码传到服务器，在根目录创建 .htaccess 文件，如图所示 第三步、.htaccess 文件文件内容编辑为以下代码 RewriteEngine On RewriteCond %{REQUEST_FILENAME} !-f RewriteCond
【原创】解决uniapp在Tomcat部署后刷新404的问题
DCTANT的博客
04-29 2275
网上几乎所有uniapp都是部署在Nginx上，而我这边要部署在Tomcat上，部署很简单，HBuilderX发行->网站-H5手机版，将生成的文件放到Tomcat->webapps->ROOT 下即可。 但是这里有和Nginx一样的问题，即刷新就404，这就非常糟糕了，问题的解决方案还是重定向到主页。 1、打开Tomcat->conf->web.xml文件...
帆软 finereport FCRA 考试 题库+答案，共收录561题，大部分有答案
热门推荐
qq_37485720的博客
11-24 2万+
帆软 finereport FCRA 考试 题库+答案，共收录561题，大部分有答案 入门基础 11.多选题 以下方式中属于FineReport中预览模式的有( ) 分页预览、填报预览、新填报预览、数据分析、移动端预览 16.判断题 FineReport报表工具必须购买激活码后才能使用。 错误，可以免费获取激活码。 29.单选题 FineReport是一款利用( )语言开发的报表工具。java 41.多选题 访问帮助文档的方式有哪些？设计器中社区菜单下-帮助文档；直接访问http://help.finere
Android基础第四篇
gaogao
08-29 1021
转载请标明出处： http://blog.csdn.net/gj782128729/article/details/52344599； 本文出自:【高境的博客】 1. Html简介1.1. 什么是HtmlHtml指的是超文本标记语言(HyperText Markup Language),是用来描述网页的一种语言。 Html不是一种编程语言，而是一种标记语言(markup langua
前端开发工程师面试题2
刘群智的博客
07-27 4969
前端开发工程师面试题2   　1、Doctype作用? 严格模式与混杂模式如何区分？它们有何意义? 　　（1）、 声明位于文档中的最前面，处于 标签之前。告知浏览器的解析器，用什么文档类型 规范来解析这个文档。 　　（2）、严格模式的排版和 JS 运作模式是  以该浏览器支持的最高标准运行。 　　（3）、在混杂模式中，页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作...
uni-app打包项目部署线上出现白屏
m0_71231013的博客
05-25 3279
当我们的项目采用uni-app的h5一键打包方式后，部署到线上服务器后会显现白屏情况，可能是我们的基础项目路径设置的不对，导致找不到文件，以至于访问白屏。2.找到web配置 将运行的基础路径修改为 “” （注：要放在你项目文件的根路径之下）1.找到uni-app的工程文件的。那么我们改如何解决呢？
tomcat服务器安装+配置远程连接+部署springboot、vue、uni-app项目（ubuntu环境下）
qq_60891453的博客
06-27 1054
下载tomcat安装包（Linux版本）解压，安装jdk、配置环境变量配置远程连接验证是否能够正常访问tomcat页面部署springboot、vue、uni-app项目（需要有一定基础，篇幅短，介绍的不够详细）
uniapp打包h5项目后网页打开空白
m0_73146522的博客
01-09 1944
5.在刚刚打开的h5文件夹下cmd进入终端。1.在manifest文件下配置路径。3.打开打包后生成的h5文件夹。6.点击下面出现的网址即可。
记录uniapp打包app过程以及遇到的空白问题
m0_64816413的博客
08-03 7652
对象在移动端的uni-app中不存在，因为uni-app是基于WebView来运行的所以会报错 我们把它注释掉 因为在app中咱们也不用担心用户没有登录 通过地址栏跳转页面的这种情况。打包完成后你的目录会生成一个unpackage文件夹 下面会有一个apk文件夹 里面就是apk的包，我们把他安装到手机上就可以啦。紧接着回到我们的Hbuilder 在操作栏找到 运行->运行到手机或者模拟器->运行到安卓基座。解释一下 这段代码在h5上是可以正常运行的 但是这段代码在uni-app真机调试时报错的原因是。
uniapp打包上线全过程-h5
weixin_42332641的博客
03-31 3869
新建一个uniapp项目，配置环境 因为要放在服务器根目录的目录下，不是根目录，所以 manifest.json，里面的运行的基础路径就是我们的子目录/owner/h5，下图第一张是服务器的目录，第二张是uniapp配置的图片 template.h5.html这个是新建项目的时候默认生成的，上生产时解注释，但是我打开后，TouchEmulator报错，所以我就一直注释掉了 因为我们是h5项目，所以点击发行-（网站-H5手机版）弹出网站的信息，依次填上网站标题，网站域名，点击发行就会运行，控制台报编译成
记录第一次完整的uni-app开发经验
weixin_48967543的博客
06-11 2301
由于我是做后端的，一直没有做过前端的页面，以前在学校图书馆看的都是jsp技术，几乎是把java代码嵌套在前端界面。后面出来实习了才发现，jsp是真的落后了。现在的大学和实际工作所需偏差太大了，没办法。后面接触到前端，是在实习的第二家公司。那时候除了写后端接口，还得把PC端的管理界面写出来。因为前端模板用到的是springboot的thymeleaf技术。开源框架是若依，代码一般都是能直接生成的。倒是也捣鼓过一些前端的东西。这几天想要帮别人做一个商品展示页面。功能相对比较简单，也是没有太多要求。 我们现在这.
使用Node.js快速搭建简单的静态文件服务器
leonqiu的博客
01-22 833
使用Node.js可以快速在本机上搭建一个静态文件服务器，对于开发JS项目非常有用。这是转载 Howard Zhang的代码，原文连接： https://www.cnblogs.com/zamhown/p/6429163.html "use strict"; //加载所需要的模块 var http = require('http'); var url = require('url'); v
uniapp 编译H5端首页可以动态修页面路径
06-08
UniApp 编译 H5 端的首页路径是在 `pages.json` 文件中指定的，通常是在 `pages` 数组的第一个元素中。如果你想要动态修改首页路径，可以修改 `pages.json` 文件，不过这样会涉及到整个 H5 端的路由配置，不建议频繁修改。如果你需要在某些特定情况下跳转到不同的首页，可以考虑使用 `uni.navigateTo()` 或 `uni.redirectTo()` 方法来跳转到不同的页面。另外，UniApp 还提供了 `uni.reLaunch()` 方法，可以跳转到应用的首页，但是这样做会重新加载整个应用，可能会影响用户体验。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值