【Vue+Android】将vue项目移植到Android手机上运行

1,443 阅读1分钟

使用工具:HBuildx3.0.4,vue2.0,vue-cli3,genymotion模拟器

(PS:项目名test2其实可以看做test,因为是后期补的图片,懒得改了😂)

步骤如下:

  1. 新建项目,选择5+APP,输入项目名,点击创建

  2. 删除目录下除manifest.json的所有文件

    =》

  3. 在vue项目的vue.config.js文件中增加设置

publicPath: process.env.NODE_ENV === 'production' ? './' : './'

同时,将router的mode:‘history’ 注释!!!

这一步非常重要,不这么设置的话可能会出现白屏!!!

  1. 执行 npm run build命令进行打包,将打包号的dist文件放置在HBuildx项目目录下

5.配置manifest.json,需要有图中圈出来的这两个

6.配置genymotion模拟器,将abd地址替换成hbildx的adb地址,然后启动

  1. 回到Hbuildx,选中index.html,点击运行->运行到手机或模拟器,选中模拟器

  2. 最终效果:

完结撒花★,°:.☆( ̄▽ ̄)/$:.°★