原生安卓打包Vue 项目成apk安装包

原生安卓打包Vue 项目成apk

本文是根据小满教程记录安装过程。
原教程链接：https://www.bilibili.com/video/BV1dS4y1y7vd?p=49&spm_id_from=pageDriver&vd_source=ee40e897f6fbe29c03c70ebdb6d589ca

安装java

1. 下载jdk java官网
2. 百度网盘：https://pan.baidu.com/s/1w8bVneDzDBnM6fz0snb3NA 提取码：pqzn

配置环境变量

我的电脑右键属性（win11则在系统控制面板找到关于） --> 高级系统设置 --> 环境变量–>系统变量 --> Path

超详细安装教程

安卓编辑器下载地址（建议科学上网不然很慢）

官网：https://developer.android.com/
链接：https://pan.baidu.com/s/1ubN-RMxN-I6Jgop2s0n07Q?pwd=6666
一直next 就行了 然后磁盘选一下 安装就可以了
安装完成以后 需要SDK 可等待软件下载 可以自己选择
SDK：压缩包
链接：https://pan.baidu.com/s/1tsyyXjI53nbtVj-JardpQQ?pwd=6666

新建一个空项目选这个就可以了

选择java 点击Finis
等下面加载完毕
右上角选择图标

然后下一步 下载要安装的 型号

一直next 然后 不能next 直接回车

就会获得安卓一个虚拟机 点击启动

启动安卓项目

启动成功以后
选择code

粘贴以下代码

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout  xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:orientation="vertical"
    android:layout_height="match_parent">
 
    <WebView
        android:id="@+id/web_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</LinearLayout  >
1
2
3
4
5
6
7
8
9
10
11
12

java 配置文件

找到这个 MainActivity.java

// 导入新的模块 
import android.app.Activity;

import android.webkit.WebView;

import android.webkit.WebViewClient;


// 修改配置文件 
public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
		//设置一个Activity的显示界面，
        WebView view = findViewById(R.id.web_view);
        //设置 WebView 属性，能够执行 Javascript 脚本
        view.getSettings().setJavaScriptEnabled(true);
 		
 		// 加载需要显示的网页 不能使用局域网地址 
 		//只能虚拟机专属地址 http://10.0.2.2:5173 端口是我们vue 项目端口
        view.loadUrl("http://10.0.2.2:5173");

        view.setWebViewClient(new WebViewClient());
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

配置权限

新增的代码

android:usesCleartextTraffic="true








 <uses-permission android:name="android.permission.INTERNET" />
 <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
 <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />


1
2
3
4
5
6
7
8
9
10
11
12
13
14

重新启动项目 就能看到页面了 打包的时候路径记得换成线上的服务器地址