189 8069 5689

详解cordova打包成webapp的方法-创新互联

在项目开发中,需要将h6页面打包成app,这个时候我们可以使用cordova来打包。在官方文档中,我们可以了解到创建一个app十分简单,你的电脑上有nodejs就行,我们可以跟着官方文档一步一步来,添加安卓平台和ios平台。整个项目结构搭建完毕后,我们可以将我们需要打包的webapp页面全部塞到这个项目结构中。接下来就是麻烦的地方了,如何进行平台开发,也就是如何将我们的项目打包成一个可安装的文件。

创新互联专注于企业全网整合营销推广、网站重做改版、北流网站定制设计、自适应品牌网站建设、H5场景定制商城网站开发、集团公司官网建设、成都外贸网站制作、高端网站制作、响应式网页设计等建站业务,价格优惠性价比高,为北流等各大城市提供网站开发制作服务。

一:设置环境变量:

1.设置JAVA_HOME环境变量,指定为JDK安装路径

2.设置ANDROID_HOME环境变量,指定为Android SDK安装路径

3.同时也要添加Android SDK的tools和platform-tools目录到你的PATH

这里需要注意的是设置ANDROID_HOME环境变量,我们可以将android studio安装到我们的电脑中,在安装过程中android studio会自动将Android SDK安装到我们的电脑里,这个时候记住这个地址就行了,如图(下面那一行的路径就是Android SDK):

详解cordova打包成webapp的方法

二:报这种错误的时候:Error:Minimum supported Gradle version is xxxx.  Current version is xxxx.

当时我在打包的时候报这钟错误,在网上查到了原因,是因为android studio更新了Gradle的版本,这个时候解决的步骤如下:

1:打开android studio,找到setting,搜索gradle,如图进行设置(具体路径各异):

详解cordova打包成webapp的方法

三:Windows cordova build Error: Could not find gradle wrapper within Android SDK. Might need to update

解决办法:

  1. 下载 Android SDK tools package(https://dl.google.com/android/repository/tools_r25.2.3-windows.zip)
  2. 进入 C:\Users\\AppData\Local\Android\sdk目录
  3. 备份tools目录
  4. 将压缩包中的tools目录解压到这个目录下
  5. 进入工程目录,再次运行 “cordova build android”。

四:安装cordova-plugin-splashscreen报错:

这个时候可能的原因是你已经打包过apk文件了,你需要将apk文件删除,然后再安装。

五:打包vue项目时遇到的问题

 1:使用npm run build打包到哪?

详解cordova打包成webapp的方法

如图,Qianne是我vue项目的名称,我在这个文件夹打开了dos窗口,然后创建一个app框架,名为myApp1。然后我将config里index.js中修改:

index: path.resolve(__dirname, '../myApp1/www/index.html'),
 assetsRoot: path.resolve(__dirname, '../myApp1/www'),
 assetsSubDirectory: 'static',
 assetsPublicPath: './',

另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。


文章名称:详解cordova打包成webapp的方法-创新互联
本文地址:http://cdxtjz.cn/article/ccdhod.html

其他资讯