cordova+vue混合式开发App

本文介绍了如何使用Cordova结合Vue进行混合式开发,详细阐述了从创建Cordova项目、打包Vue应用、安装插件、修改APP名称和图标,到最后打包APK的全过程,并针对可能出现的问题提供了解决方案。
摘要由CSDN通过智能技术生成

        应公司要求第一次使用cordova打包了一下vue写的app项目,期间遇到了不少问题,整理一下流程并记录一下常见问题吧。
        cordova打包项目需要的环境配置啥的就不具体讲啦,百度一下很多教程~

1. 创建cordova项目并添加Android平台

创建项目指令:cordova create hello com.example.hello helloworld

  1. 第一个hello是cordova自动生成的项目文件夹名称
  2. 第二个com.example.hello我一般填写公司的名称,比如:com.csdn.hello
  3. 第三个helloword是打包完成后app的名称。

        创建完cordova项目后我们需要通过指令进入cordova项目的路径下才可进行后续操作:
         进入项目目录指令:cd hello
        进入项目目录后,我们需要添加对应的平台,这里我们用的是Android平台
         添加平台指令:cordova platform add android

2. 打包vue项目

打包vue项目指令:npm run build
        首先打包好你的h5项目,我们公司是用vue框架写的项目,因此打包的时候遇到一个问题,即打包生成的静态页面打开为空白页,百度搜索之后发现是路径指向问题,只需要在vue.config.js文件中修改publicPath的值为“./”即可解决问题。

publicPath: '/',   &
  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值