利用HBuilder将vue项目打包成移动端app
事先准备,开发完成的web app项目(也可以利用vue-cli脚手架构建vue模板项目),npm run dev可以正常预览的项目
1,将项目目录下config文件内index.js中assetsPublicPath修改为 assetsPublicPath: './'
2,执行npm run build之后生成dist文件夹
3,打开HBuilder,文件->打开目录,如下图
选择刚才生成的dist目录,输入项目名称,点击完成
附HBuilder下载地址:http://www.dcloud.io/
3,此时会看到HBuilder项目下多了一个W标识(表示web项目)的myApp项目,
右键菜单选择‘转换成移动‘转换成移动App’,然后‘myApp’前面的标识就变成了‘A’,至此就已经转换成移动app了,
随后就可以利用HBuilder连接真机运行
或者发行成为原生app
注意:如果真机运行或模拟器运行报如下错误
Uncaught Error: [vuex] vuex requires a Promise polyfill in this browser
以下为以android apk为例的发行为原生app的步骤
1,点击发行,这里发布测试apk选择使用DCloud公用证书,点击‘打包’
2,正在制作安装包,制作完成,手动下载
3,将下载的apk安装到android的手机看效果,以下是放到模拟器中的效果
利用HBuilder将vue项目打包成移动端app的更多相关文章
- vue项目打包成html,在本地点击直接能打开
默认情况下vue项目打包后,本地打开index.html是空白的,有报错.Failed to load resource: net::ERR_FILE_NOT_FOUND 这时需要修改config-& ...
- cordova+vue 项目打包成Android(apk)应用
现在使用vue开发的项目越来越多,使用vue开发的移动端打包就成了最大的问题.现在前端打包方案有好多种,但是综合来说,我比较喜欢用cordova来进行Android和ios的打包,配置完成之后,每次只 ...
- cordova将vue项目打包成apk
1,若vue项目不在cordova项目里,直接把它复制进来,避免改动代码的麻烦 2,直接按照以下链接进行操作即可 链接:https://www.cnblogs.com/qirui/p/8421372. ...
- 使用electron将单页面vue webapp 打包成 PC端应用
在看张鑫旭博客得时候看到了electron这个东西,来了兴趣,就按照上面写的将已经做好得vue项目拿来试了试,出乎意料得顺利 electron简单说下electron,就是把 chrome内核和你的项 ...
- cordova+vue 项目打包成APK应用遇到的问题和解决方法
公司前端界面用的是vue,我要嵌入到Android中生成App第一步:安装nodenode安装:直接进入官网https://nodejs.org/zh-cn/,下载最新版本安装.安装之后在命令行中使用 ...
- 记录下hbuilder vue项目打包APP 在IOS上点击延迟的问题
做的项目打包成APP在IOS 上有延迟问题,在安卓下却不会,联想到之前 用IONIC时打包的APP也是 在IOS下有300毫秒延迟问题.所以 只能 认吧. 安装fastclick 插件: npm in ...
- Java项目打包成exe的详细教程
Java项目打包成exe的详细教程 把Java项目打包成exe共分为以下两步: 1. 利用Eclipse先把Java项目先打成jar包 2. 利用exe4j工具把jar包转成exe 这里以Java项目 ...
- AndroidStudio项目打包成jar
AndroidStudio项目打包成jar 前言:在eclipse中我们知道如何将一个项目导出为jar包,现在普遍AndroidStuido开发,这里一步一步详加介绍AS项目打包成jar,jar和ar ...
- AS 3.1 项目打包成jar或aar
1.首先明白一个道理. Android Studio编译的时候会自动将项目生成jar和aar的,我一开始以为jar需要自己单独生成,其实AS已经自动生成了,网上找的很多资料都是一个复制的过程而已. 只 ...
随机推荐
- bash guide
Table of Contents Basic Operations 1.1. File Operations 1.2. Text Operations 1.3. Directory Operatio ...
- golang使用redis
redigo使用 手册地址:http://godoc.org/github.com/garyburd/redigo/redis github地址:https://github.com/garyburd ...
- ButterKnife官方使用例子
Introduction Annotate fields with @BindView and a view ID for Butter Knife to find and automatically ...
- Coding语言强弱类型且动静态类型简单解析。附图解
话不多说,上图: (以下均以Java来说明) 对于语言的强弱类型: 1.强类型语言:通俗的点来讲,就是对于数据类型,如果开发者定义了一个int数据类型的变量,那么虚拟机就会特别坚定该变量为int,坚决 ...
- 堆栈Stack介绍
堆栈(Stack)代表了一个后进先出的对象集合.当您需要对各项进行后进先出的访问时,则使用堆栈.当您在列表中添加一项,称为推入元素,当您从列表中移除一项时,称为弹出元素. Stack 类的方法和属性 ...
- Python之线程 1 - 线程基本概念
一 背景知识 1.进程 2.有了进程为什么还要线程 3.线程的出现 二 线程和进程的关系 三 线程的特点 四 线程的实际应用场景 五 内存中的线程 六 用户级线程和内核级线程(了解) 1.用户级线程 ...
- python 小数据池,is and "==",decode ,encode
一:小数据池 1.python运行中的缓存: 2.目的:缓存我们字符串,整数,布尔值.在使用的时候不需要创建过多的对象 3.python 缓存数据:缓存:int, str, bool. ...
- Shiro入门 - 通过自定义Realm连数数据库进行认证
添加shiro-realm.ini文件 [main] #自定义Realm myRealm=test.shiro.MyRealm #将myRealm设置到securityManager,相当于Sprin ...
- 在已有的Java项目中使用Kotlin
需要配置两个地方首先在项目点gradle文件中引入Kotlin插件 然后在module的build.gradle文件中应用插件
- 关于Scroller的使用
这篇文章讲解的很详细 https://blog.csdn.net/u011102153/article/details/53337648