vue打包android

已于 2023-10-19 22:50:00 修改
阅读量770 收藏 3
点赞数 2
文章标签： vue.js 前端 javascript
于 2023-10-19 22:18:21 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qzh88888888/article/details/133934541
版权

今天配置vue android打包环境足足花了我6个小时，终于弄好了，在此记录一下，期间的曲折整过的伙伴们应该知道，如果用二个字形容：“崩溃”

废话不多话，开始搭建打包环境

搭建vue android打包环境：

一.安装java jdk 并配置环境变量 本人安装的是1.8 。

jdk下载，安装，环境配置 有java基础的人都知道，在此越过。

二.安装Android SDK

去官网下载AndroidSDK，地址：AndroidDevTools - Android开发工具 Android SDK下载 Android Studio下载 Gradle下载 SDK Tools下载找到对应的sdk tools下载：

可以下载安装包和压缩包，exe文件需要双击安装，压缩包只需解压就可以直接用，我这里下载压缩包(注意：我这个目录已经安装过依赖，刚解压的目录内当然不是这个样子)：

然后双击SDK Manager.exe&#x

最低0.47元/天 解锁文章
JAVA码龍
关注
  • 2
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Android与H5（Vue）交互
gdvfs12的博客
12-08 798
JS调用Android方法实现dialog弹窗，Android点击弹窗确定/取消按钮调用JS方法，在H5界面展示传递的参数
Android与Vue借助WebView双向通信
weixin_62350313的博客
03-20 4513
借助webview进行原生Android与vue进行交互通信
2024年vue项目如何打包以及如何变成android、ios应用程序(1)，今日头条前端社招面试
最新发布
2301_76278747的博客
05-11 808
为了帮助大家更好的了解前端，特别整理了《前端工程师面试手册》电子稿文件。开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】2. webpack配置在中，我们就可以写很多webpack配置，常用的有: 配置端口号，配置跨域服务器代理等。我们需要的主要是配置一个打包的目录publicPath,否则打包出来的apk文件，安装在安卓手机上，可能出现白屏，具体配置如下:publicPath: “./”,// 需要配置 否则打包后的apk文件安装在手机可能白屏。
vue项目android,Android与Vue项目交互
weixin_33490603的博客
05-29 1538
1. Android代码class MainActivity : AppCompatActivity() {private lateinit var callJSBtn: Buttonprivate lateinit var webView: WebViewprivate var ajObject: AjObject = AjObject()override fun onCreate(savedI...
vue项目打包成安卓app
fangyes888的博客
11-13 715
创建cordova项目 cordova create folkmusic com.music.folkmusic musicapp 将新增项目中的www替换成vue打包出来的build文件 例如：cordova create tran com.cn.px.tran tranapp cordova create tran com.cn.px.tran tranapp folkmusic是项目名称，com.music.folkmusic是包名，musicapp是程序的标题 新增项目 cordova platfo
前端VUE项目打包成安卓APP
Gabriel的专栏
08-18 4367
1.打包vue项目，在项目的根目录执行命令 npm run build,直至项目打包完成 打开dist文件件，里面有一个index.html和static文件夹。 2.新建cordova项目 2.1安装cordova，命令行执行 npm install -g cordova 2.2利用cordova创建一个新项目，命令行执行cordova create folkmusic com.music.folkmusic musicapp folkmusic是项目名称，com.music.folk.
webview Android和vue.js的交互
qq_41522141的博客
04-04 5477
介绍 本文将实现HTML - JS - Java来完成HTML5端与Android手机间的互访！ 代码 交互方式 js调用Android方法 通过WebView的addJavascriptInterface()进行对象映射 通过 WebViewClient 的shouldOverrideUrlLoading ()方法回调拦截 url 通过 WebChromeClient 的onJsAlert()、onJsConfirm()、onJsPrompt()方法回调拦截JS对话框alert()、confirm(
Android启动http运行vue程序.rar
12-24
然而，这个描述提到了"部署在Android本地"，这可能意味着使用了一个本地HTTP服务器来运行Vue打包后的静态资源。这通常涉及以下步骤： 1. **构建Vue应用**：在Vue项目中，开发者使用`npm run build`命令将Vue应用...
vue项目用HBuilder打包APP.docx
09-09
此外，你可以在“发行”菜单中选择“原生App云打包”，然后选择打包Android版本。如果你没有Android证书，可以选择免费的公用证书。 打包完成后，HBuilder X会提供一个APK下载链接，将APK文件下载并安装到你的...
用Cordova打包Vue项目的方法步骤
10-17
主要介绍了用Cordova打包Vue项目的方法步骤，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
cordova打包项目android生成apk签名.txt
08-17
cordova打包项目android生成apk签名.txt
vue项目在安卓低版本机显示空白的原因分析(两种)
12-09
vue项目在安卓低版本机显示空白原因： 可能的原因一 查看安卓debug，报错，可能有箭头函数语法错误，或者其他语法问题，那可能是ES6语法问题。 这时候需要安装babel-pollyfill。 网上找到方法如下： ...
vue开发移动端android打包Webstorm+cordova打包vue成Android项目
Two_Too的专栏
10-18 6374
一. 打包vue vue项目开发完成后， 使用 npm run build 打包成功之后，打开生成的dist文件夹中的 index.html，看看是不是ok的，没问题就继续下一步。 二. 使用cordova打包android项目 1. 新建cordova项目 全局安装cordova： npm install -g cordova 创建cordova项目： cordova c...
vue打包成安卓-遇坑
changaspl
07-09 399
vue转安卓 npm run build # 打包 npm install -g cordova # 安装cordova # 利用cordova创建一个新项目 cordova create folkmusic com.music.folkmusic musicapp # folkmusic是项目名称，com.music.folkmusic是包名，musicapp是程序的标题 # 将刚才在vue项目中打包生成的dist文件夹下面的index.html和static文件夹复.
Vue项目转apk打包成手机APP详细步骤
weixin_60131763的博客
01-08 4220
Vue项目转apk打包成手机APP详细步骤
Android Studio 超级简单的打包生成apk
热门推荐
我爱吃麻花的博客
01-14 24万+
Android Studio 超级简单的打包生成apk为什么要打包： apk文件就是一个包，打包就是要生成apk文件，有了apk别人才能安装使用。打包分debug版和release包，通常所说的打包指生成release版的apk，release版的apk会比debug版的小，release版的还会进行混淆和用自己的keystore签名，以防止别人反编译后重新打包替换你的应用。 简单点说就是给你的
android studio打包纯H5项目(集成5+SDK)
一念执着。c的博客
10-23 1万+
我们下载5+SDK直接复制demo出来 ![在这里插入图片描述](https://img-blog.csdn.net/20181023173807288?watermark/2/text/aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5NzAyMzY0/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70) 改个名...
Android Studio 中将一个项目打包成APK
路飞哈的博客
01-31 2926
AS打包项目步骤： 第一步：点击Build子菜单中的 Generate Signed Bundle/APK 项； 第二步选择APK，然后下一步； 第三步没有密钥库的时候选择Creqate new…新建密钥库； 第四步有密钥库也可按需选择已存在密钥库，将密钥信息填写完整，如下图流程； 第五步勾选V1，V2，点击finish即进入打包； 第六步打包完成后，在项目源代码文件HelloWord\...
Android Studio 的四种打包方式
banchengyinghuayu的博客
06-19 2万+
      虽然这个博客的内容很简单，但是作为新手的我还是百度了好久才掌握了Android Studio的打包方式，希望对后来人有所帮助。打包的第一种方式（1）在Android Studio 中选中app这么module，选择菜单栏“”Build——Generate signed APK“”（2）弹出窗口      （3）创建密钥库及密钥，创建后会自动选择刚创建的密钥库和密钥（已拥有密钥库跳过） ...
vue 引用Android
12-22
在Vue中引用Android组件的方法如下所示： ```html <template> <div class="container"> <androidText @eventName="handleIt" :text="textValue"/> </div> </template> <script> export default { data() { return { textValue: '' } }, methods: { handleIt(result) { this.textValue = result.keyName; } } } </script> ``` 上述代码中，我们在Vue组件中使用了`androidText`组件，并通过`@eventName`监听了一个事件。当事件被触发时，会调用`handleIt`方法，并将原生组件传递过来的数据作为参数`result`进行处理。在`handleIt`方法中，我们将`result.keyName`的值赋给了`textValue`，从而实现了获取到数据并在Vue组件中使用的功能。 另外，原生组件提供了一个名为`getTestData`的方法，可以通过以下方式调用并获取数据： ```java JSMethod public void getTestData(String params, JSCallback callback) { // 根据传入的参数执行相应的逻辑 // ... // 返回的结果必须为Map<String, Object> Map<String, Object> maper = new HashMap(); maper.put("key", value); callback.invoke(maper); } ``` 上述代码中，`getTestData`方法接收一个参数`params`和一个回调函数`callback`。在方法中，根据传入的参数执行相应的逻辑，并将结果存储在一个`Map<String, Object>`对象中。最后，通过调用`callback.invoke(maper)`将结果返回给Vue组件。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值