uni-app,初次使用

  • 第一次使用CSDN写博客
    • 1.了解
    • 2.使用
    • h5打包好的效果如下
    • 3.结语

第一次使用CSDN写博客

1.我写博客的原因,梳理知识,整理思路,好记性不如烂笔头做个记录吧!记录生活!

1.了解

大概在我使用hbuilder的时候,在官网浏览下载的hbuilder时候无意中发现了uni-app,官网建议学习了vue.js之后就容易上手,当时还没学过vue.js,就简单了解了一下。(一年前),后来学习了vue.js也没有去学习uni-app,现在uni-app推广做的很好了,我在mpvue,vue.js的官网上面发现了uni-app的友情链接,大肆推广,搞活动鼓励大家写插件。然后我就慢慢开始想学了,平台支持也更多了,从只支持小程序,app,h5,增加了百度,支付宝,字节跳动小程序。最近公司接了一个项目,要多个平台的版本,公司有android ,ios 所以我要写小程序,和h5页面加超管后台,所以我的任务很重,就想到了uni-app并准备使用。好了不废话了进入正题。

2.使用

1.打开https://uniapp.dcloud.io/ 官网发现,如何学习一栏,找到一个在腾讯课堂学习的简单视频,通过一个晚上的学习大致了解了一下。
2.看完,就打开新版hbuilderX,开始新建一个uni-app项目,有各种模板,新闻模板,看图模板,普通模板,演示模板,其中演示模板多了一个hybrid文件夹,并且只能在手机端运行,估计是集成了hybrid。
3.简单一点来说,就是一个vue.js和微信小程序的结合体,底部tabBar 的写法和小程序一样,里面的元素使用的是标签,但整体架构与vue.js类似,文件结构与小程序类似,直接可以上手。看了他们的案例基本就可以写东西了。
4.platforms文件夹是用来存放不同设备不同的页面功能的,app显示第一个页面,h5第二个页面,

5.还有一个点在代码里面有if 判断在指定客户端显示指定的代码
6.还有一个坑,android端,h5,微信小程序测试没问题,h5打包无法运行,因为不能在file端运行并且还需要配置 ,需要配置在manifest.json 1标题随便写
2 模板路径不写
3路由模式感觉history更快
4运行基础路径就是www 域名 下面的路径 放到根目录就不填
5 端口看你具体看你如何配置的 我的是80
6 最后 在发行里面打包h5 填写域名 我是本地服务 127.0.0.1
7好了把打包好的文件放到根目录运行看效果

h5打包好的效果如下

3.结语

1.就到这里把,后面遇到更多的坑,我会在这里记录,有什么问题欢迎大家来交流。

uni-app学习心得和填坑,关于uni-app 打包h5 页面的坑相关推荐

  1. Thymeleaf本页面通过controller跳转到本页面的坑

    当你尝试用spring boot+thymeleaf,来实现本页面跳转到本页面功能时,我们以index通过controller跳转到index为例,你会发现,return"index&quo ...

  2. 微信小程序调试页面的坑

    使用微信开发者工具切新的页面保存刷新无法在左侧直接预览必须在app.json文件配置页面(填写路径但是不用写后缀名),并且把想要预览的页面放在第一个位置. 转载于:https://www.cnblog ...

  3. HBuilder X ——Uni app 学习笔记(一)

    HBuilder X --Uni app 学习笔记(一) 1.pages.json配置 *pages数组中第一项表示应用启动页,数组中其他项为项目中所有页面路径. enablePullDownRefr ...

  4. SpringSecurity安全框架学习心得,避免踩坑。

    最近有一个项目需要用到SpringSecurity安全框架,特意简单学习了一下,中间也踩了很多坑,在这里记录一下避免以后踩坑. 1.引入: 在很多的项目中,都会遇到认证问题,就是管理员与用户等不同角色 ...

  5. react项目中的参数解构_一天入门React学习心得

    一天入门React学习心得 阅读前必读 本文写的仓促,算是一个学习笔记吧,算是一个入门级的学习文章.如果你刚刚入门,那么可能一些入门的视频可能更加适合你.但如果具备一些知识,比如Vue,那么视频就不适 ...

  6. 【大白话学习】UniApp 微信小程序与APP应用 开发零基础入门教程(二)---登陆界面功能实现

    打开 main.js,这个文件里定义的是整体小程序中会用到的一些 功能 (即变量之类),也就是说,只要在这里出现的功能,其它页面可以直接拿来使用.可以把它理解为: 共享单车main ,大家都可以用. ...

  7. Uni-App - 学习心得

    背景介绍 大概在今年的十月份左右,我了解到Dcloud推出了uni-app.当时下载了一个Hbuilder X,下载了官方提供的hello示例教程.经过一番努力,在云端打包成功了.当时这个软件还不够完 ...

  8. 前端和后端的英文_80后老阿姨转行做前端的学习心得,深情交流!

    一.Why choose front-end 2012.07毕业后,进了一家游戏公司做运营策划,写过营销方案.做过内容编辑.知道广告投放和换量,还得兼职产品经理画原型. 每天9.30-23.00以后, ...

  9. 80后老阿姨转行做前端的学习心得,深情交流!

    一.Why choose front-end 2012.07毕业后,进了一家游戏公司做运营策划,写过营销方案.做过内容编辑.知道广告投放和换量,还得兼职产品经理画原型. 每天9.30-23.00以后, ...

最新文章

  1. 一文看懂模糊搜索1.0到3.0的算法迭代历程
  2. ValueError: Shape mismatch: The shape of labels (received (768,)) should equal the shape of logits e
  3. MySQL双主(主主)架构方案
  4. Codeforces Round #260 (Div. 1) C. Civilization(dfs+并查集)
  5. pip install python -32_pip安装python模块方法
  6. R载入需要的程辑包:rJava Error
  7. 小爱同学App下架苹果App Store 网友:SiriOS警告?
  8. 使用devcon禁用启用网卡
  9. js 生成二维码(qrcodejs)
  10. 非华为电脑安装华为电脑管家,实现与手机平板的多屏协同
  11. 聚合直播,直播接口的使用
  12. SPLUS XML操作
  13. 解决linux下sudo更改文件权限报错xxxis not in the sudoers file. This incident will be reported.
  14. Unity/C# 随机生成中文名
  15. 简单易懂,过程详述大整数进制转换
  16. 正面管教读书笔记 10 你的性格对孩子性格的影响
  17. ctab法提取dna流程图_CTAB法提取DNA
  18. Git 初學筆記 - 指令操作教學
  19. Shader效果实现:双色渐变
  20. 【matlab】:matlab的输入和输出

热门文章

  1. 【回顾】“双11”首个元宇宙日 中国移动通信联合会元宇宙产业委员会揭牌 《元宇宙产业宣言》发布
  2. 帝国cms会员中心1.2
  3. 分割 fasta 文件
  4. cpu、内存、硬盘之间的关系
  5. 调用第三方api在线生成二维码
  6. RabbitMQ核心功能介绍
  7. Linux(一): 磁盘分区
  8. Java调用有道翻译API包括APPID/密钥地址注册
  9. 从《我不是潘金莲》谈程序员的核心竞争力 1
  10. Android安全相关