vue项目使用uniapp生成app的全过程

 更新时间:2023年10月08日 09:37:47   作者:Carla卡拉伊  
这篇文章主要介绍了vue项目使用uniapp生成app的全过程,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教

首次接触uniapp 像个丈二和尚 百度无果 最终求助uniapp官方群群友解决

把我的完成过程记录下来

详细步骤

1. npm run build 打包vue项目

2. 在 HbuilderX 新建 5+app 项目

3. 将打包好的项目 dist 文件夹下的文件全部复制,拷贝到新建项目的根目录,有重复的直接覆盖

4. 配置启动头 打开新建项目的 manifest.json文件 > 图标配置 > 自动生成图标 > 选择一张图片 > 自动生成所有图标并替换

在这里插入图片描述

5. 打开新建项目的 index.html ,不然浏览器运行时会弹框提示 浏览器运行尚不支持此种类型文件

在这里插入图片描述

6. 把 index.html 里的路径都改成相对路径,不然会报错

在这里插入图片描述

7. 数据线连接安卓手机和电脑,打开开发者模式,use调式也打开 ,> 运行 > 运行到手机或模拟器 > 手机 ,这时项目就能在手机上展示了

在这里插入图片描述

注意事项(过程中遇到的小问题)

  • 因为是生成手机app, 所以要先改成移动端的
  • 真机或者手机模拟器都不存在跨域问题,所以要把跨域代码去掉

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • vuex中Modules的使用详解

    vuex中Modules的使用详解

    本文主要介绍了vuex中Modules的使用详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-04-04
  • vue等两个接口都返回结果再执行下一步的实例

    vue等两个接口都返回结果再执行下一步的实例

    这篇文章主要介绍了vue等两个接口都返回结果再执行下一步的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-09-09
  • 一文彻底搞懂Vue中scoped和/deep/原理

    一文彻底搞懂Vue中scoped和/deep/原理

    在Vue中,有两种常用的CSS选择器,用于修改组件样式:scoped 和 /deep/(或 ::v-deep),它们都是为了实现样式的作用域,本文小编就来分别给大家介绍一下这两种选择器的原理,需要的朋友可以参考下
    2023-08-08
  • Vue动态控制input的disabled属性的方法

    Vue动态控制input的disabled属性的方法

    这篇文章主要介绍了Vue动态控制input的disabled属性的方法,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-06-06
  • 详解TypeScript+Vue 插件 vue-class-component的使用总结

    详解TypeScript+Vue 插件 vue-class-component的使用总结

    这篇文章主要介绍了TypeScript+Vue 插件 vue-class-component的使用总结,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-02-02
  • vue地址栏直接输入路由无效问题的解决

    vue地址栏直接输入路由无效问题的解决

    这篇文章主要介绍了vue地址栏直接输入路由无效问题的解决,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-11-11
  • Vue3中Composition API和Options API的区别

    Vue3中Composition API和Options API的区别

    Vue3的Composition API和Options API是Vue.js框架中的两种不同的API,本文主要介绍了Vue3中Composition API和Options API的区别,文中通过示例代码介绍的非常详细,需要的朋友们下面随着小编来一起学习学习吧
    2023-06-06
  • vue--elementui中如何修改el-input样式

    vue--elementui中如何修改el-input样式

    在使用 element ui 组件过程中,我最近碰到了新的问题,vue--elementui中如何修改el-input样式呢,今天小编通过示例代码给大家详细讲解,需要的朋友参考下吧
    2023-05-05
  • vue中如何简单封装axios浅析

    vue中如何简单封装axios浅析

    Axios 毋庸多说大家在前端开发中常用的一个发送 HTTP 请求的库,用过的都知道,篇文章主要给大家介绍了关于vue中如何简单封装axios的相关资料,需要的朋友可以参考下
    2021-06-06
  • Vue使用axios发送请求并实现简单封装的示例详解

    Vue使用axios发送请求并实现简单封装的示例详解

    这篇文章主要介绍了Vue使用axios发送请求并实现简单封装,主要包括安装axios及简单使用配置方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-06-06

最新评论