集团官网
  • 国家级全民数字素养与技能培训基地
  • 河南省第一批产教融合型企业建设培育单位
  • 郑州市数字技能人才(码农)培养评价联盟

教程 | Vue移动端项目如何打包成APP?

编辑:云和数据 日期:2020-12-21 09:14
导语:
在vue项目开发完成后,如果你想把项目打包成一个APP,那么本文你一定要收藏!不需要复杂的操作,只需要点点手指,就可以啦!快来看看吧!

1,把vue项目打包成dist目录

我们先将项目目录下config文件内index.js中

assetsPublicPath修改为 assetsPublicPath: ‘./’

然后打包成dist文件夹,在cmd输入以下命令

    npm run build1

    你就可以得到下面这个文件夹

    2,下载Hbuilder

    然后在Hbuilder中打开dist目录,我们可以得到下图

    3,打包成app

    接着我们右击这个dist目录,选择转化为移动app

    这时候就会出现一个manifest.json,点击

    这里你可以选择启动图配置,选择你喜欢的启动图,也可以跳过。

    大部分的设置都可以默认,跳过

    最后

    对了,因为vue项目没办法检测这个手机物理返回键,所以我们可以在index.html文件中修改一下,很简单

         123    
     document.addEventListener('plusready', function(a)  { //等待plus ready后再调用5+ API:                   在这里调用5+ API                  var first = null;                   plus.key.addEventListener('backbutton', function()  { //监听返回键                          //首次按键,提示‘再按一次退出应用’                           if (!first) {                               first = new Date().getTime(); //获取第一次点击的时间戳                               // console.log('再按一次退出应用');//用自定义toast提示最好                               // toast('双击返回键退出应用'); //调用自己写的吐丝提示 函数                               plus.nativeUI.toast("双击退出", {duration:'short'}); //通过H5+ API 调用Android 上的toast 提示框                               setTimeout(function() {                                   first = null;                              }, 1000);                          }  else {                               if (new Date().getTime() - first < 1000) { //获取第二次点击的时间戳, 两次之差 小于 1000ms 说明1s点击了两次,                                   plus.runtime.quit(); //退出应用                              }                           }                      }, false);              });    
    直接复制贴上去就行了。
    点击导航栏的发行,选择云打包

    广告可以去掉,点击打包。

    打包完成,下载到手机,就可以安装使用了。
    云和数据作为一个深耕IT职业教育多年的教育者,目前的课程涵盖云计算、大数据、人工智能、虚拟现实、软件工程、用户体验设计、网络安全、电子商务等八大方向,结合企业实际用人需求,只为培养更多高端IT技术人才。

    相关内容

    抢先一步 鸿蒙(HarmonyOS)应用开发者高级认证 免费考! 适合人群计算机相关专业在校生(技师、中职、高职、本科、研究生)对鸿蒙(HarmonyOS)有兴趣的非计算机相关专业在校生目前正在从事移动应用的开发者目前正在从事计算机行业相关的人计算机专业高校老师所有对鸿蒙(HarmonyOS)有兴趣的人 培训方案掌握鸿蒙的核心概念和端云一体化开发、... 什么是Java的多态性(polymorphism)?它有哪些不同的形式? 多态性是Java面向对象编程的一个重要概念,它允许不同的对象以一致的方式响应同一个方法调用,具体表现为对象在运行时可以表现出多个不同的形态。多态性主要有两种不同的形式:编译时多态性(静态多态性)和运行时多态性(动态多态性)。1. 编译时多态性(静态多态性):   ... 如何学习和搭建Hadoop开发环境? Hadoop是大数据处理领域的重要平台,能够处理和分析大量数据。为了有效地利用Hadoop,我们需要学习其基础知识,并正确搭建开发环境。下面是详细的学习和搭建指南。一、学习Hadoop基础掌握基础概念和原理Hadoop主要由HDFS和MapReduce两部分组成。HDFS是分布式文件系统,Ma... UI 设计学习如何进阶成为高手 我总结了六种方法,帮助你走出舒适区,提高技能,成长为自信且经验丰富的UI设计高手一位经验丰富的 UI 设计师,往往十分看中应用程序界面的吸引力和视觉刺激,确保满足用户期望和需求。但是,如果你已经在 UI 设计圈摸爬滚打多年,仍然没有出色的作品,那你极有可能是因为陷入了一个舒适圈,UI技能一直原... 在Java中Executor和Executors的区别? 在Java中,Executor和Executors都与线程池和并发执行有关,但它们是不同的概念和类。1.ExecutorExecutor是一个接口,位于java.util.concurrent包中,用于表示一个执行任务的执行器。它只定义了一个方法:void execute(Runnable c... String类型的常见命令有哪些? String类型,也就是字符串类型,是Redis中最简单的存储类型。其value是字符串,不过根据字符串的格式不同,又可以分为3类:string是普通字符串,int整数类型,可以做自增、自减操作,float浮点类型,可以做自增、自减操作。String的常见命令有:SET:添加或者修改已经存在的...