cordova +uniapp 打包android

最新推荐文章于 2025-05-27 12:25:46 发布
最新推荐文章于 2025-05-27 12:25:46 发布
阅读量3.4k 收藏 5
点赞数 3
CC 4.0 BY-SA版权
文章标签： hash cordova
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_41521961/article/details/106835107
本文详细介绍了如何解决uniapp在Cordova打包后出现的白屏问题，通过修改manifest.json中的路径设置和router模式，以及调整index.js中的uniConfig参数，最终成功解决了白屏现象。

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

uniapp 打包后放入cordova www 文件包后一直白屏，卡了很久，在老大帮助下终于找到问题，以下是具体操作：

1. 在 manifest.json 修改下面内容：

    1）在mainfest.json中设置h5节点的publicPath为:’./'打包后即为相对路径   "publicPath":"./",

    2） mainfest.json中设置h5节点 增加以下内容：

       "router" : {
            "mode" : "hash",
            "basePath":""
        }

    修改后的 mainfest.json中 h5节点 的代码是这样的:

    "h5" : {
        "devServer" : {
            "port" : 8080,
            "disableHostCheck" : true
        },
        "title" : "项目标题",
        "domain" : "",
        "template" : "index.html",
        "publicPath":"./",
        "router" : {
            "mode" : "hash",
            "basePath":""
        }
    }

3. 修改打包后的配置文件

修改index.xxxxx.js文件的 uniConfig.router={mode:"hash",base:"/"}改成uniConfig.router={mode:"hash",base:"./"}

 

然后重新cordova run android, 就可以啦~~

 

运动减肥
关注
cordova打包项目android生成apk签名.txt
08-17
cordova打包项目android生成apk签名.txt
通过cordova将vue项目打包为Android app
panpancake的博客
08-09 1984
（先安装cordova和vue） 1. 安装vue： npm install vue npm install –global vue-cli 2. 创建vue项目 vue init webpack my-project 3. 安装依赖 cd my-project npm install 4. 运行vue项目 npm run dev 5. 添加cordova项目（打包环
uniapp框架生成h5时如何引入cordova插件
最新发布
dlorwolleh的博客
05-27 510
上述html模版名称为template.h5.htm，位置在项目根目录。这里引入需要引用的js文件，以上述cordova.js作为示例。js文件用于暴露cordova插件的接口函数，方便页面调用。uniapp框架下的项目，但是需要用到cordova插件。
uni-app（一）uni-app与framework7+cordova选择对比。
飞天代码的博客
09-17 4153
前一段时间用framework7+cordova做了2个app，后面因为甲方公司要求采用uni-app开发了2个app。如果还在徘徊选择什么框架的话，我果断推荐使用uni-app。 对比下uni-app与framework7+cordova的优缺点： framework7比uni-app强的地方 提供了一套完整的ui，ui非常漂亮而且整体风格统一，动画组件丰富。虽然uni-app的插件库丰富，但都是各个大神各自为战写出来但组件，确少全局性和整体性。如果您公司有大神坐镇这就不是问题了。 framework7
Cordova - file插件的使用详解（文件的创建、读写，文件夹创建等）
热门推荐
固本培元的专栏
10-14 1万+
Cordova 提供了一个 file 插件，通过这个插件我们很方便地实现在各种设备下对文件、和文件夹进行访问，编辑等各种操作。  一、添加File插件 首先我们要在“终端”中进入工程所在的目录，然后运行如下命令添加 file 插件： 1 cordova plugin add cordova-plugin-file
解决cordova+vue 项目打包成APK应用遇到的问题
11-29
在开发移动应用时，有时需要将前端框架如Vue与Cordova结合，以便将Web应用打包成原生的Android APK。本篇文章将详细讲解如何解决在使用Cordova和Vue.js进行项目打包过程中可能遇到的问题。 首先，我们需要确保开发...
用Cordova将vue项目打包成app
bing103425的博客
07-23 7469
1.配置安卓环境 （1）下载JDK和JRE，安装（通常JDK会集成JRE，所以只需安装JDK就好）JDK一定要是 8 版本（JDK1.8），Down了个10版本的差点配到吐也没成功，这是个惊天神坑 （2）下载Android  SDK，双击安装，复制下安装目录 （3）配饰环境变量：系统 => 高级系统设置 => 环境变量 =>系统变量 => 新建 新建一个ANDR...
使用Cordova打包H5到安卓
Ybbb的博客
09-29 2383
1、配置开发环境 安卓的话，随便搜一下都有很多，这里放一个相对比较详细的 传送门 安装cordova 就直接看官方文档 官网链接 2、创建项目 cordova create 文件名 appid app名称 cordova platform add ios/android cordova cordova plugin add cordova build ...
cordova vue插件开发_Cordova+vue混合开发app中实现短视频拍摄功能
weixin_42524883的博客
12-29 654
在最近项目中需要实现一个前端拍摄短视频并上传后端的功能。最初考虑的实现方式是使用拍摄短视频的安卓sdk并且改成cordova插件。考虑目前做的比较成熟的sdk有七牛云的短视频拍摄sdk，功能强大。此sdk实现了类似与微信的按住拍摄松开停止的功能，并且可以自动转码并且上传七牛云服务器。但是缺点如下：1.sdk只提供函数接口，即使改成cordova插件页面也需要再重写一个类似于上图的vue页面，不如调...
将uniapp打包成h5后用cordova打包
07-13
将UniApp打包成H5后使用Cordova进行打包是可行的。下面是一些步骤： 1. 首先，确保您已经按照UniApp的文档将应用程序打包为H5版本。这将生成一个包含HTML、CSS和JavaScript文件的目录。 2. 确保已经安装了Cordova...
ionic混合开发APP
07-18
1 简介 1、Native APP（原生） 2、Hybrid APP（混合） 3、React Native Hybrid App按网页语言与程序语言的混合，通常分为三种类型：多View混合型，单View混合型，Web主体型。 2 技术 2.1 技术选型 Ionic 2.1.1 Ionic介绍 Ionic是一款基于Angular、Cordova的强大的HTML5移动应用开发框架，可以快速创建一个跨平台的移动医用。可以快速开发移动APP、移动WEB页面、微信公众平台应用，混合APP WEB页面。 2.1.2 Ionic和cordova、Angular关系 Ionic = cordova + Angular + ionic Css Ionic 是完全基于谷歌的 Angular 框架，在 Angular 基础上面做了一些封装，让我们可以更快速和容易的开发移动的项目。Ionic 调用原生的功能是基于 Cordova,Cordova 提供了使用JavaScript 调用 Native 功能，ionic 自己也封装了一套漂亮的 CSS UI 库。 2.1.3 开发工具 Visual Studio Code 2.1.4 管理工具 Git 2.2 环境搭建 2.2.1 概述 2.2.2 JDK 2.2.2.1 版本 jdk1.8 2.2.2.2 配置 JAVA_HOME PATH CLASSPATH 2.2.3 Apache ant 2.2.3.1 版本 1.9.12 2.2.3.2 解压 2.2.3.3 配置 ANT_HOME: D:\android\apache-ant-1.10.4 Path: %ANT_HOME%\bin 2.2.3.4 查看安装版本 ant –v 2.2.4 android SDK 2.2.4.1 版本 r24.4.1 2.2.4.2 配置 ANDROID_SDK_HOME: D:\Android\android-sdk-windows Path:%ANDROID_SDK_HOME%\platform-tools;%ANDROID_SDK_HOME%\tools 2.2.4.3 SDK 通过SDK Manager下载相关的版本 2.2.4.4 查看信息 android -h 2.2.5 node.js 2.2.5.1 版本 8.11.3 2.2.5.2 安装 2.2.5.3 查看版本 node –v npm -v 2.2.6 npm/cnpm 2.2.6.1 安装npm nodejs已经集成了npm 2.2.6.2 安装 cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org 2.2.7 cordova 2.2.7.1 版本 8.0.0 2.2.7.2 安装 npm install -g cordova 可以使用cnpm代替npm cnpm install -g cordova ionic 2.2.7.3 查看版本 cordova -v 2.2.8 ionic 2.2.8.1 版本 3.20.0 2.2.8.2 安装 npm install –g ionic 可以使用cnpm代替npm cnpm install -g cordova ionic 2.2.8.3 查看版本 ionic –v 2.2.8.4 查看信息 ionic info 3 项目 3.1 创建 3.1.1 新建 3.1.2 启动 3.1.3 打包 3.1.3.1 添加 3.1.3.2 生产release版apk（签名后安装） 3.1.3.3 生成debug版apk 3.1.4 签名 3.1.4.1 生成签名文件 keytool -genkey -v -keystore testapp.keystore -alias testapp.keystore -keyalg RSA -validity 20000 3.1.4.2 apk签名 jarsigner -verbose -keystore testapp.keystore -signedjar app-release-signed.apk app-release-unsigned.apk testapp.keystore 3.1.5 安装 安卓手机安装使用
【Android APP重点推荐】Cordova+SDK搞定Android-app并真机测试总结（包含Cordova的每一个步骤）
weixin_43343144的博客
04-08 956
准备工作： cordova官方文档：https://cordova.apache.org/ cordova环境搭建文档：https://www.w3cschool.cn/cordova/ cordova环境搭建参考：https://blog.csdn.net/weixin_43343144/article/details/89056856 Cordova生成APP的步骤： 第一步：创建...
cordova插件cordova-plugin-file实现本地文件访问
zh5220909的博客
06-24 4886
在使用cordova开发H5模式APP时，我们经常会使用到本地文件。 cordova提供了很多插件供给我们使用详情请访问官网：https://www.npmjs.com/ 经过前段时间的实战，还是感觉这个插件最实用:https://www.npmjs.com/package/cordova-plugin-file cordova-plugin-file 安装： cordova plugin add cordova-plugin-file 插件内部的实例有很多具体的直接看官网给出的文档或者直接
cordova插件的创建和使用
qq_45263880的博客
12-11 981
cordova插件的创建和使用 一、 下载 plugman，要全局下载 npm下载：npm install -g plugman 下载完成后在控制台输入：pluman -v 如果下载成功会输出以下信息 二、创建cordova 插件 1在你要创建插件的目录下打开命令行，输入以下指令创建插件，创建成功的话在目录下会生成相应 插件文件 指令格式：plugman create --name [插件名] --plugin_id [插件id] --plugin_version [版本号] 例子： plugman cr
记录uniapp打包app过程以及遇到的空白问题
m0_64816413的博客
08-03 1万+
对象在移动端的uni-app中不存在，因为uni-app是基于WebView来运行的所以会报错 我们把它注释掉 因为在app中咱们也不用担心用户没有登录 通过地址栏跳转页面的这种情况。打包完成后你的目录会生成一个unpackage文件夹 下面会有一个apk文件夹 里面就是apk的包，我们把他安装到手机上就可以啦。紧接着回到我们的Hbuilder 在操作栏找到 运行->运行到手机或者模拟器->运行到安卓基座。解释一下 这段代码在h5上是可以正常运行的 但是这段代码在uni-app真机调试时报错的原因是。
关于apche/cordova的接入流程
青穗的博客
08-02 1220
下面介绍下Cordova，他会让你更加方便的实现跨平台开发Cordova（原名PhoneGap）是一种移动开发框架，它允许开发者使用Web技术（HTML、CSS和JavaScript）来创建跨平台的移动应用程序。Cordova提供了一种将Web应用打包成原生应用的方式，使开发者可以在多个平台上构建一次，然后在iOS、Android、Windows Phone等平台上运行。Cordova允许开发者在一次代码编写后，将应用打包成适用于多个平台的原生应用。
Uni-app开发H5时需要与App通信。
qq_33526759的博客
05-31 1683
在23年，要将这个App迁移到uniapp平台，一开始是对照着代码进行改写，但是之前的开发人员离职了，并且没有进行交接，没有技术文档等，于是就开始着手迁移，后来几经波折，项目在网页上跑起来了。plus是Html5+联盟定制的一套规范接口，简单的说你用uniapp弄出来的App在上面运行网页，这个网页就能通过plus去调用原生能力，例如摄像头。虽然套了App的壳子，但是运行的还是web，问题来了，以前他使用的平台插件，例如调用摄像头拍照、扫码，调用蓝牙等非UI界面请求逻辑都要重写。那么网页如何发送呢？
《node+koa2+uniApp+mysql 项目搭建到部署 》[保姆级步骤九]
学全栈、大前端方向，就找前端早间课
03-21 231
前端路上 | 所知甚少，唯善学。各位小伙伴有什么疑问，欢迎留言探讨。— 关注我：前端路上不迷路 —
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值