首页 > 其他分享 >Quasar +Cordova 开发移动端app

Quasar +Cordova 开发移动端app

时间:2024-06-11 17:12:53浏览次数:28  
标签:src www cordova Quasar app quasar android Cordova

使用cordova开发移动端app安装、配置教程见:https://www.cnblogs.com/sunshine233/p/18241626

quasar+cordova文档: https://www.quasar-cn.cn/quasar-cli-vite/developing-cordova-apps/introduction

按照 使用Cordova运行项目到android  安装、配置完以后,quasar文档可以直接从

 https://www.quasar-cn.cn/quasar-cli-vite/developing-cordova-apps/preparation#2-%E4%B8%BA-quasar-%E9%A1%B9%E7%9B%AE%E6%B7%BB%E5%8A%A0-cordova-%E6%A8%A1%E5%BC%8F 开始看。

  1. 创建一个 quasar项目:  npm init quasar  , 按照提示输入内容
  2. cd 项目名,比如  cd helloworld 
  3. 在quasar项目中添加cordova模式: quasar mode add cordova  ,然后项目文件夹中会出现一个src-cordova文件夹,它所做的是使用 Cordova 脚手架 在 /src-cordova 文件夹中生成一个 Cordova 项目。每次构建时会覆盖 /src-cordova/www 文件夹。注意:此时会让输入id,需要修改包名格式为 com.test.projectName,否则 cordova platform add android 时会报错包名格式不对。
  4. 切换到 Cordova 项目 cd src-cordova  
  5. 添加Android平台: cordova platform add android  , 如果报错,按照错误信息修改 src-cordova/config.xml 中id为 com.test.helloworld
  6. 运行项目到Android手机: quasar dev -m cordova -T android  或者简约版  quasar dev -m android 

此时usb连接的手机就运行了(你好你好是我自己加的):

【注意】此时手机有apk的图标,但实际上点开以后里面是一个网页,192.068.0.101:8080,所以必须联网且能热更新。如果想要不需要联网也能使用的apk文件,可以用 cordova 的原生打包命令,继续往下看。

如果想要打包发布,运行  quasar build -m android 。但需要注意,这里文档写的是

我们可以在 “/src-cordova/platforms/android/app/build/outputs/apk/release” 或等效路径(写在终端输出中)中找到我们未签名的 APK 文件。文件名通常以 “-release-unsigned.apk” 结尾。 

  但实际运行后,我的项目提示

Build succeeded

 Build mode................ cordova
 Pkg quasar................ v2.16.4
 Pkg @quasar/app-webpack... v3.13.2
 Pkg webpack............... v5
 Debugging................. no
 Publishing................ no
 Packaging mode............ cordova
 Transpiled JS..... yes (Babel)
 ==========================
 Output folder............. E:\code_cordova\quasarCordova\dist\cordova

 Tip: "src-cordova" is a Cordova project folder, so everything you know
      about Cordova applies to it. Quasar CLI only generates UI the content
      for "src-cordova/www" folder and then Cordova takes over and builds
      the final packaged file.

 Tip: Feel free to use Cordova CLI ("cordova <params>") or change any files
      in "src-cordova", except for "www" folder which must be built by Quasar CLI.

  而在 E:\code_cordova\quasarCordova\dist\cordova 路径中没有apk文件,只有.aab ,如图:

 查询得知 aab 是谷歌应用商店要求的新格式,可以转为 apk,具体可以看 :https://blog.csdn.net/qq_39420519/article/details/118554055

由控制台  Tip: "src-cordova" is a Cordova project folder, so everything you know about Cordova applies to it.  提示可知,进入 src-cordova 后,可以使用 cordova 原生命令,  cordova build android 和  cordova run android   。

【注意】如果修改了文件内容, 需要先执行  quasar build -m android   把内容重新编译到 src-cordova,然后再运行 cordova 命令修改才能生效。

【注意】 quasar dev -m android  启动了项目,项目运行期间不能同时使用cordova命令,否则会报错。一定注意先终止  quasar dev -m android 的运行,才能执行

   cordova build android 和  cordova run android

 

标签:src,www,cordova,Quasar,app,quasar,android,Cordova
From: https://www.cnblogs.com/sunshine233/p/18242351

相关文章

  • 基于springboot+vue.js+uniapp小程序的社区团购系统附带文章源码部署视频讲解等
    文章目录前言详细视频演示具体实现截图技术栈后端框架SpringBoot前端框架Vue持久层框架MyBaits系统测试系统测试目的系统功能测试系统测试结论为什么选择我代码参考数据库参考源码获取前言......
  • 基于Vue+Node.js的高校学业预警系统+10551(免费领源码)可做计算机毕业设计JAVA、PHP、爬
    NodeJS高校学业预警系统摘 要随着科学技术的飞速发展,社会的方方面面、各行各业都在努力与现代的先进技术接轨,通过科技手段来提高自身的优势,教育行业当然也不能排除在外。高校学业预警系统是以实际运用为开发背景,运用软件工程开发方法,采用Node.JS技术构建的一个管理系统。......
  • Xcode 16 beta (16A5171c) 下载 - Apple 平台 IDE
    Xcode16beta(16A5171c)下载-Apple平台IDEIDEforiOS/iPadOS/macOS/watchOS/tvOS/visonOS请访问原文链接:https://sysin.org/blog/apple-xcode-16/,查看最新版。原创作品,转载请保留出处。作者主页:sysin.orgXcode16betaincludesSDKsforiOS18,iPadOS18,tvOS18......
  • 使用Cordova运行项目到android
    ApacheCordovaisanopen-sourcemobiledevelopmentframework.Itallowsyoutousestandardwebtechnologies-HTML5,CSS3,andJavaScriptforcross-platformdevelopment.Applicationsexecutewithinwrapperstargetedtoeachplatform,andrelyonstandar......
  • uniapp(微信小程序)扫普通链接二维码打开小程序
    扫普通链接二维码打开小程序配置普通链接二维码数据1.登录微信公众平台2.开启扫普通链接二维码打开小程序功能3.点击添加4.生成二维码5.代码中通过onLoad生命周期获取二维码信息6.通过微信扫一扫测试是否正确获取二维码信息。场景:小程序中某些商家或企业想要生成......
  • DoNet Core的启动过程-WebApplicationBuilder
     1.前言 在NET6开始做ASP.NETCore的开发,我们首先要看的是启动过程,而WebApplication和WebApplicationBuilder类是启动过程好不开的类,WebApplicationBuilder来引导启动,这和前面Core的版本引导启动分为Program和Startup是不同的,.NET6及以上版本直接使用Program中引导启动,而We......
  • cordova-plugin-inappbrowser内置浏览器插件
    一、InAppBrowser(内置浏览器)允许在在单独的窗口中加载网页。例如要向应用用户展示其他网页。当然可以很容易地在应用中加载网页内容并管理,但有时候需要不同的用户体验,InAppBrowser加载网页内容,应用用户可以更方便的直接返回到主应用。二、安装命令:cordovapluginaddcordov......
  • springboot使用ComponentScan和MapperScan
    今天讲springboot项目中的启动类换到了start包下,发现无法扫描并注册javabean. 原因:容器在启动时会由spring.classPathBeanDefinitionScanner和spring-mybaits.classPathMapperScanner两个类去执行doScan方法,如果没有使用@ComponentScan和MapperScan两个注解spring会使用Spring......
  • 强烈推荐 Setapp 上的 Mac 优质软件
    Setapp一款专为macOS设计的软件订阅平台,目前提供高达240款精心筛选的高品质应用程序,只需每月9.9美元的订阅费,即可畅享所有正版软件的使用权。让使用者无忧享受正版软件的稳定性和安全性,彻底告别盗版软件可能引发的风险与不便。Setapp官网:访问(提供7天免费试用)Seta......
  • ApplicationContextAware获取IOC容器
    目录常见Aware实现ApplicationContextAware作用1、ApplicationContext是什么?2、ApplicationContextAware作用ApplicationContextAware使用常见Aware实现接口作用ApplicationContextAware获取当前应用的上下文对象EnvironmentAware获取环境变量,包括我们配置的以及......