如何将vue项目打包为.apk文件

19 篇文章 3 订阅
订阅专栏
本文详细介绍了如何使用Vue.js开发的应用打包成APK,适用于在安卓设备上安装。首先修改build.js中的assetsPublicPath,然后通过npm run build打包生成dist文件夹。接着在HBuilderX中新建5+App项目,将dist内容导入并进行云打包。最后,下载打包成功的APK文件,即可在安卓设备上安装使用。
摘要由CSDN通过智能技术生成

说明:使用Vue.js开发完毕的app一般不作处理的话,就只能在浏览器上做为Webapp使用。如果需要将它安装到安卓手机上就需要打包为.apk文件了。

前提:安装HBuilderX

具体步骤

1.在vue项目中找到config/build.js

2.找到build下的assetsPublicPath属性: 改变 ‘/’, 为’./’ (ps:加个点)

img

3.在终端执行**npm run build**命令打包,产生dist文件夹(这里就是整个项目的所有功能)

4.打开HBuilderX,新建项目,选择 5+App类型的项目

img

5.输入项目名称,如:vueapk,点击创建

img

6.可以删除掉默认的文件夹(css,img,js),把dist目录下的文件拷贝到vueapk下(记住:不要dist

img

7.点击HbuilderX菜单:发型–>原生App云打包:

8.做一步配置(一般的话这个应用标识AppID是自动分配的):

img

9.选择使用公共证书:

img

10.点击打包,耐心等待。(等待的时间长短由计算机配置决定。)

img

11.打包成功

img

点击地址下载apk文件,在安卓设备上安装即可。

注意:打包完成后,一个项目只能下载5次,需要注意保存好apk文件。

vue项目通过hbuilderx打包apk
Debug的博客
06-28 533
1.vue项目npm run build 得到dist文件夹 dist文件夹内容示例 新建5+APP项目 空的5+APP项目文件夹情况 将dist文件夹下的内容粘贴(并覆盖)到5+APP下后
解决cordova+vue 项目打包APK应用遇到的问题
11-29
公司前端界面用的是vue,我要嵌入到Android中生App 第一步:安装node node安装:直接进入官网https://nodejs.org/zh-cn/,下载最新版本安装。安装之后在命令行中使用”node -v” 检查安装是否功。 npm安装:由于新版的nodejs已经集了npm,所以node安装时npm也一并安装好了。同样可以通过输入 “npm -v” 来测试是否功安装。 第二步:安装cordova 1. 打开cmd 输入命令:npm install -g cordova .安装cordova 2. 验证是否安装功,cmd中输入命令: cordova -v 如下
vue移动端项目打包app
01-08
这几天 我做了一个vue移动端的小项目 就想着打包 app安装在手机上看看 我就讲解下整个思路和过程 首先项目开发完之后  (我使用的是vue-cli 3.*版本) 在项目文件夹下创建一个 vue.config.js module.exports = {   publicPath: “./”,    //   打包 配置这个可以先本地查看下 效果   productionSourceMap: false     //  调试文件的功能关闭 能加快打包 }; 运行命令行   npm run build 项目文件夹下生一个 dist文件夹 下面有这些文件  然后打开index.html 本地
vue项目如何打包Android APK(保姆教程)
最新发布
ahualong1的博客
09-13 564
实现vue项目编译打包为Android APKvue项目是无法直接打包APK的,vue项目需要npm run build 正式打包为H5项目(html、js、css),使用HBuilderX在把H5项目打包为Android项目
教你如何3分钟把VUE项目打包apk,真的只要3分钟
邓占勇的博客
11-03 1万+
前提准备 使用vue-cli3搭建的项目 工具 HBuilder X,他的图标长这个样子,点击下载 做前端的大多数小伙伴们都应该知道,使用起来轻巧、急速,但是他主要是针对于VUE生态打造的,相对于 vscode 缺少了丰富的插件支持以及多语言编译的支持。但是它也有vscode无法满足的功能,比如说今天我们就要用它来把vue项目打包apk打包步骤 执行 npm run build 打包vue项目 下载并安装HBuilder X 依次点击文件》新建》项目,选择 5+APP(A) 选项,并填写好项目
vue项目打包apk
m0_52933282的博客
07-21 767
手把手教你把你写的vue项目运行在手机上,瞬间让你找到开发的乐趣。
Vue项目打包apk
qq_22841387的博客
09-25 300
Vue项目打包apk 1.打包项目 ①修改index.js文件内容 进入目录config/index.js,修改assetsPublicPath 加一个.即可 ②打开TERMINAL或者终端 ③输入命令npm run build 出现下图即build完 2.在HBuilderX中新建项目 链接:HBuilderX官网下载 ①点击文件—>新建—>项目 ②选择5+App,并输入项目名称,项目安装地址 ③将原始css、img、js三个文件删除 ④将打包的dist导入项目 3.配置相
vue项目打包为APP,静态资源正常显示,但API请求不到数据的操作
10-14
使用Vue CLI时,执行`npm run build`命令会将项目打包到`dist`目录下,生可供部署的静态资源。 4. **打包后的路径问题**: 如果在打包后打开`index.html`无法看到页面内容,可能是因为静态资源的路径问题。在`...
通过cordova将vue项目打包为webapp的方法
10-17
根据给定文件信息,我们来详细了解如何通过Cordova将Vue项目打包为WebApp。这里所涉及到的知识点覆盖了准备工作、Vue项目的配置、Cordova项目的创建以及Android平台的支持。下面将详细解释这些步骤以及背后的原理。 ...
Vue项目打包APK----Vue发布App
weixin_42080056的博客
04-30 1079
Vue项目HB打包APK
VUE项目打包apk
m0_71231013的博客
07-07 2811
需要下载一个HBuilder X编辑器,不过我相信大家身为前端开发工程师,都会有,但是下面我还是会放一个下载地址,以防有些同学没用过uni开发。在我们的开发需求中,可能会遇到需要将vue项目中的H5代码打包一个安卓的app,那么我为大家介绍一套保姆级的解决方案,看完你就会。这里会告诉你你打包好的文件apk会放在哪里,之后安装测试即可。编辑器,新建一个5+App的项目
vue 项目打包 apk 安装包详细步骤
热门推荐
sywdebug的博客
10-27 1万+
下面有说明"全屏并非状态栏透明或变色,而是没有状态栏",就像打王者吃鸡的时候,手机顶部状态栏是不显示的,那就是全屏显示。而下面说的状态栏透明则是沉浸式状态栏,这里面没有配置项,但是可以自己写,如果需要可自行添加。随后点击 manifest.json,会给你调出配置页面,自行配置。打开左边源码视图,找到"plus",在这个里面加上这串代码即可。在打包队列中,等就完事了,过会控制台会给你弹出下载链接。就是这个玩意,里面的 css、js 等文件复制过去。大概五分钟过后,打包好了,这个链接就是下载地址。
VUE项目打包apk
weixin_45574675的博客
12-06 779
在实际的开发过程中,我们可能需要将vue项目打包为安卓安装包。通过Hbuilder的方式打包不需要在本机安装安卓打包方式,可以直接进行打包
vue项目打包APK
qq_42717015的博客
03-14 574
vue项目打包APK
【安卓开发】将Vue项目打包为app
你不来,再美的天地,都狼藉 ~
05-13 9400
一文带你将Vue项目发布app!
vue项目 打包apk(android)
weixin_56831647的博客
07-20 772
vue项目打包apk
vue代码打包apk文件
qq_56418482的博客
10-30 631
第一步下载第二步登录 HBuilderX官网创建应用第三步1.在HBuilderX中新建项目​​​​​​​2.配置manifest.json文件3.点击发行——>原生App-云打包4.点击使用公共测试证书,也可以自己生证书,可以同时选择Android和IOS包,也可以单独选择,选择完点击打包5.等待打包,点击链接自动跳转到浏览器下载。
HBuilder打包前端Webapp为APK全攻略:Vue项目实战
在这里,将项目转换为移动项目类型。 6. **设置启动图标**:在HBuilder中,会自动检测到项目的JSON文件,点击它会弹出设置界面,允许你自定义启动图标等应用信息,使其看起来更像原生应用。 7. **打包APK**:...
写文章

热门文章

  • @RequestParam详解 91106
  • 计算机网络—一个自治系统有5个局域网,其连接图如图所示。LAN2至LAN5上的主机数分别为:91,150,3,15。该自治系统分配到的IP地址块为30.138.118/23。试给出每一个局域网的地址块 66261
  • BigDecimal保留两位小数 65411
  • Linux命令 移动/复制文件/目录到指定目录下 53508
  • Linux中使用netstat命令的基本操作,排查端口号的占用情况 53089

分类专栏

  • 其他 31篇
  • Spring 93篇
  • SpringBoot 285篇
  • 分布式 12篇
  • Linux 62篇
  • MySQL 162篇
  • Java细节 562篇
  • SpringCloud 6篇
  • 计算机网络 28篇
  • MyBatis 39篇
  • Java 74篇
  • 操作系统 5篇
  • Git 10篇
  • 大数据 21篇
  • 云原生 2篇
  • Docker 10篇
  • 流媒体 6篇
  • Redis 29篇
  • 视频 8篇
  • 微服务 13篇
  • Nginx 5篇
  • MyBatis-Plus 32篇
  • 软件工程 2篇
  • Vue 19篇
  • 数据结构与算法 18篇
  • 面试 30篇
  • IOT 11篇
  • Jackson 5篇
  • mina 4篇
  • JVM 9篇
  • SpringMVC 26篇
  • Java注解 8篇
  • Idea 19篇
  • Shiro 2篇
  • Maven 22篇
  • Socket 8篇
  • JSON 9篇
  • UE4 2篇
  • Java8新特性 40篇
  • 多线程 17篇
  • GSON 16篇
  • Excel导出 19篇
  • Http 16篇
  • 软件测试 7篇
  • 接口文档 2篇
  • Java异常 3篇
  • ThreadLocal 7篇
  • MinIO 3篇
  • Dubbo 45篇
  • 抓包工具 2篇
  • 导出Word 3篇
  • Web3 1篇
  • SSM 22篇
  • Postman 7篇
  • JTS 9篇
  • DataWorks 3篇
  • Jenkins 3篇
  • FreeMarker 2篇
  • 支付 5篇
  • BigDecimal 1篇
  • Exception 4篇
  • JNDI 1篇
  • ODPS 1篇
  • MaxCompute 1篇
  • MongoDB 1篇
  • Flask 1篇
  • JavaWeb 1篇
  • JPA 3篇
  • svn 9篇
  • Stream 3篇
  • Chrome浏览器 1篇
  • zip 1篇
  • JS 5篇
  • Windows 2篇
  • Navicat 1篇
  • AWT 3篇
  • Lambda 1篇
  • Zookeeper 1篇
  • OkHttp 1篇
  • 日志 26篇
  • WebSocket 12篇
  • WebService 5篇
  • fastjson 1篇
  • Objects 1篇
  • Java设计模式 7篇
  • HTML 4篇
  • Swagger 4篇
  • NIO 3篇
  • RSA 2篇
  • XSS 3篇
  • Tomcat 8篇
  • JWT 1篇
  • Netty 1篇
  • HashMap 7篇
  • Golang 1篇
  • Servlet 10篇
  • fiddler 2篇
  • JUC 1篇
  • 发送邮件 5篇

最新评论

  • MySQL 视图(详解)& navicat如何创建视图

    权颜 好好生活: 视图view是一种虚拟存在的表,是一个逻辑表

  • 网页前端(Html)video播放m3u8(HLS)&Vue使用video.js播放m3u8

    hot water.: 把 css,js 下载下来引用,会报这个错误 Class constructor g cannot be invoked without 'new'

  • synchronized对象锁与类锁用法&如何用synchronized锁字符串对象,这里面的坑要注意

    只爱吃苹果: main进来了Mon Aug 15 10:19:47 CST 2022 main获取到锁Mon Aug 15 10:19:47 CST 2022 Thread-0进来了Mon Aug 15 10:19:47 CST 2022 Thread-0获取到锁Mon Aug 15 10:19:49 CST 2022 main结束了Mon Aug 15 10:19:49 CST 2022 Thread-0结束了Mon Aug 15 10:19:51 CST 2022 1 2 3 4 5 6 我们可以看到,Thread-0线程和main线程,执行synchronized代码块是互斥的。 但是,这种加锁方式太笨重,每一个线程执行到synchronized代码块都会互斥。 这个执行不是都进来了吗,哪里互斥了呢

  • Java中new Date插入mysql数据库,数据库时间多一秒问题

    sutonline: 附上官网链接: https://dev.mysql.com/doc/refman/5.7/en/date-and-time-literals.html

  • 关于Redis配置主从复制踩到的坑,主机不显示从机的连接信息

    lovebiancheng_: 一模一样解决了吗

大家在看

  • C语言 | Leetcode C语言题解之第486题预测赢家
  • C++ | Leetcode C++题解之第485题最大连续1的个数
  • Python | Leetcode Python题解之第482题秘钥格式化
  • Python | Leetcode Python题解之第485题最大连续1的个数
  • C语言 | Leetcode C语言题解之第482题秘钥格式化

最新文章

  • CXFServlet类的作用
  • @Scheduled注解的scheduler属性什么作用
  • 过滤器、拦截器、aop的先后顺序和作用范围&拦截器preHandle(),postHandle(),afterComplation()方法执行顺序
2024
08月 2篇
05月 7篇
04月 24篇
03月 39篇
02月 40篇
01月 37篇
2023年396篇
2022年734篇
2021年865篇
2020年3篇

目录

目录

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Archie_java

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或 充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值

深圳坪山网站建设公司信阳实惠的企业网站优化公司针对学校网站做SEO优化方便徐汇区优化推广网站销售做网站优化效果松原网站优化网站优化能提升业绩西乡网站关键词优化服务商中国网站优化系统代理项目武汉优化网站公司优化神马网站关键词自然延安网站优化邯郸家装行业网站优化推广技巧网站优化seo教程沙河优化网站建设浙江芜湖网站优化素材网站优化技巧其他网站优化如何做三都县网站优化公司北京网站优化推广方案推荐中山卫浴网站seo优化谷歌小语种网站怎么优化雷州seo网站排名优化软件门户网站怎么优化莱山个性化网站优化公司兖州网站优化公司怎么做网站优化 s四川品质网站优化产品介绍巴中网站页面优化扬州广陵网站优化公司哪家专业一流的网站优化香港通过《维护国家安全条例》两大学生合买彩票中奖一人不认账让美丽中国“从细节出发”19岁小伙救下5人后溺亡 多方发声卫健委通报少年有偿捐血浆16次猝死汪小菲曝离婚始末何赛飞追着代拍打雅江山火三名扑火人员牺牲系谣言男子被猫抓伤后确诊“猫抓病”周杰伦一审败诉网易中国拥有亿元资产的家庭达13.3万户315晚会后胖东来又人满为患了高校汽车撞人致3死16伤 司机系学生张家界的山上“长”满了韩国人?张立群任西安交通大学校长手机成瘾是影响睡眠质量重要因素网友洛杉矶偶遇贾玲“重生之我在北大当嫡校长”单亲妈妈陷入热恋 14岁儿子报警倪萍分享减重40斤方法杨倩无缘巴黎奥运考生莫言也上北大硕士复试名单了许家印被限制高消费奥巴马现身唐宁街 黑色着装引猜测专访95后高颜值猪保姆男孩8年未见母亲被告知被遗忘七年后宇文玥被薅头发捞上岸郑州一火锅店爆改成麻辣烫店西双版纳热带植物园回应蜉蝣大爆发沉迷短剧的人就像掉进了杀猪盘当地回应沈阳致3死车祸车主疑毒驾开除党籍5年后 原水城县长再被查凯特王妃现身!外出购物视频曝光初中生遭15人围殴自卫刺伤3人判无罪事业单位女子向同事水杯投不明物质男子被流浪猫绊倒 投喂者赔24万外国人感慨凌晨的中国很安全路边卖淀粉肠阿姨主动出示声明书胖东来员工每周单休无小长假王树国卸任西安交大校长 师生送别小米汽车超级工厂正式揭幕黑马情侣提车了妈妈回应孩子在校撞护栏坠楼校方回应护栏损坏小学生课间坠楼房客欠租失踪 房东直发愁专家建议不必谈骨泥色变老人退休金被冒领16年 金额超20万西藏招商引资投资者子女可当地高考特朗普无法缴纳4.54亿美元罚金浙江一高校内汽车冲撞行人 多人受伤

深圳坪山网站建设公司 XML地图 TXT地图 虚拟主机 SEO 网站制作 网站优化