利用HBuilder打包前端开发webapp为apk
转载
现在的前端开发可谓是,百花齐放啦,什么都可以做,只有想不到没有做不到的,今天就简单的介绍用vue,ng或者是react开发的单页应用如何打包为apk,在移动设备上运行。
这里以vue为例,其他的差不多,大家可以根据自己的情况去查找相应资料。
第一步,需要安装node,如果是做前端的er,这个应该就不用过多介绍了。
第二步,使用vue-cli工具初始化vue项目,这里只是做一个测试的项目,所以vue-router等东西就不用安装了,实际项目,根据具体情况而论。
第三步,常规的开发,比如希望实现的功能等。
第四步,开发完成后需要配置项目为线上项目前的几个配置,如下:
上面主要是打包前的配置。
第五步,打包项目。
第六步,打开HBuilder开始打包为apk。文件-》打开目录,选择刚刚项目的dist目录,项目名称随便,这里就为dist
在项目上右键转成移动项目
当项目的图片上显示为a时就可以了。接下来就是设置启动的图标等信息了,直接点击json的文件就会有设置界面
然后发行为原声应用
进行相应设置就可以了
刷新一下就可以看到打包完成的 apk 文件了
打包成功后就可以将apk文件复制到手机上查看效果了。
利用HBuilder打包前端开发webapp为apk的更多相关文章
- 利用HBuilder打包Vue开发的webapp为app
众所周知,前端开发完成的webapp只能运行在浏览器上,对运行环境有一定的限制,也就是除了浏览器其他的环境下不支持:那么现在如果有个需求是这样的呢?需要一套代码三端运行呢?三端运行(黑人脸??)是的, ...
- 利用connect建立前端开发服务器
利用connect建立前端开发服务器 对于前后端完全分离的系统,开发时候我们需要给前端配置服务器,当然我们可以选择Nginx之类的服务器进行配置,但我们也能使用NodeJS构建高自由度的前端开发服务器 ...
- app:利用HBuilder打包webpack项目
1.安装HBuilder 2.将你的项目在HBuilder中打开 3.控制台 打包编译 npm run build 4.新建一个app项目,将项目编译生成的dist文件夹 ,复制到app项目中 5.双 ...
- webApp前端开发技巧总结
自Iphone和Android这两个牛逼的手机操作系统发布以来,在互联网界从此就多了一个新的名词-WebApp(意为基于WEB形式的应用程序,运行在高端的移动终端设备.我相信各位童鞋应该和我一个样子, ...
- 利用HBuilder将vue项目打包成移动端app
事先准备,开发完成的web app项目(也可以利用vue-cli脚手架构建vue模板项目),npm run dev可以正常预览的项目 1,将项目目录下config文件内index.js中assetsP ...
- 20个实用的webApp前端开发技巧
自Iphone和Android这两个牛逼的手机操作系统发布以来,在互联网界从此就多了一个新的名词-WebApp(意为基于WEB形式的应用程序,运行在高端的移动终端设备). 开发者们都知道在高端智能手机 ...
- Angular企业级开发(6)-使用Gulp构建和打包前端项目
1.gulp介绍 基于流的前端自动化构建工具,利用gulp可以提高前端开发效率,特别是在前后端分离的项目中.使用gulp能完成以下任务: 压缩html.css和js 编译less或sass等 压缩图片 ...
- 初学seaJs模块化开发,利用grunt打包,减少http请求
原文地址:初学seaJs模块化开发,利用grunt打包,减少http请求 未压缩合并的演示地址:demo2 学习seaJs的模块化开发,适合对seajs基础有所了解的同学看,目录结构 js — —di ...
- 简单利用jQuery加tomcat,让前端开发不再依赖于后端的接口
前端开发的过程中,我们免不了和后端进行联调,这时候就会出现以下的尴尬场景: 接口没写好,没法做接下来的功能 功能写好了,接口没写好,没法测这个功能 联调了,除了BUG,不知道锅在谁身上,只得陪后端耗时 ...
随机推荐
- jQuery实现todo及轮播图
内容: 1.todo程序 2.轮播图 1.todo程序 需求: 实现一个todo程序,可以添加数据,可以删除数据,可以修改数据,可以查看所有数据 另外实现自己的一系列弹窗:用于提示用户的提示框.用于警 ...
- UVA540-队列
题意: 每一个数字有自己所属的团队,如果所属的团队已经有人在队列里,放在团队的最后一个,要不然放队列里最后一个 注意:一个团队里的最多1000个元素,但是入队,出队的操作会达到200000次 解法:循 ...
- python入门-测试代码
断言 测试函数 def get_formatted_name(first,last): """generate a neatly formattef full name& ...
- PHP Token(令牌)设计 避免重复提交
设计目标: 避免重复提交数据. 检查来路,是否是外部提交 匹配要执行的动作(如果有多个逻辑在同一个页面实现,比如新增,删除,修改放到一个PHP文件里操作) 这里所说的token是在页面显示的时候,写到 ...
- leetcode944
public class Solution { public int MinDeletionSize(string[] A) { ; ; j < A[].Length; j++) { ; i & ...
- DB2 to mysql
1.安装DB2 create database testdb connect to testdb 2. 将DB2 ixf格式into DB2 IMPORT FROM /tabxxx.IXF OF IX ...
- 安装设置IIS5.1
1.防止不停提示无法复制staxmem.dll: esentutl /p %windir%/security/database/secedit.sdb提示数据库损坏,是否恢复,选是,出现以下提示后退出 ...
- 使用Eclipse对FFmpeg进行调试
在研究代码的过程中,调试运行是一种非常有效的方法.我们常用的Visual Studio建立的工程可以很方便地对程序进行调试运行.但是对于FFMpeg这样的工程,想要进行单步调试就没这么容易了.如果一定 ...
- javascript事件之鼠标滚轮(mousewheel)和DOMMouseScroll事件
javascript事件之鼠标滚轮(mousewheel)和DOMMouseScroll事件 发布时间:2015-02-07 编辑:www.jquerycn.cn 本文学习下,javascript ...
- 定制sudo的密码保持时间以及如何不需要密码
由于每次sudo什么都要输入密码..好麻烦.所以我要把它的密码记住时间修改一下,变得长一点. 先输入命令 vim /etc/sudoers找到下面行 Defaults env_reset 改变此行为下 ...