uniapp学习笔记：一套代码，运行到7个平台（一）

前两天总结了一下小程序的一些开源的框架之后&＃xff0c;有大佬在底下留言评论补充&＃xff0c;uniapp没有写上&＃xff0c;去年有小伙伴把我拉到这个群聊里面去了&＃xff0c;当时还没有怎么了解这个框架&＃xff0c;当时日常看他们聊天似乎很厉害的样子&＃xff0c;今天&＃xff0c;小小的体验了一下开发文档。

文档&＃xff1a;https://uniapp.dcloud.io/

uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架&＃xff0c;开发者编写一套代码&＃xff0c;可编译到iOS、Android、H5、小程序等多个平台

1&＃xff1a;下载安装如下工具&＃xff1a;HBuilderX 可视化界面

http://www.dcloud.io/hbuilderx.html

为了方便开发&＃xff0c;我们选择下载App开发版&＃xff0c;可开箱即用

下载解压&＃xff0c;找到应用程序exe&＃xff0c;点击打开

2&＃xff1a;打开编辑器之后&＃xff0c;在点击工具栏里的文件 -> 新建 -> 项目&＃xff1a;

选择uni-app&＃xff0c;输入工程名&＃xff0c;如&＃xff1a;test-uni&＃xff0c;点击创建&＃xff0c;即可成功创建 uni-app。点击模板里的 Hello uni-app 即可体验官方示例。

到这里创建项目成功&＃xff0c;可以看到初始化的项目了。

:3&＃xff1a;接下来开始运行

进入项目&＃xff0c;点击工具栏的运行 -> 运行到浏览器 -> 选择浏览器:&＃xff0c;我这里选择的是谷歌浏览器。当然了&＃xff0c;这里提供了几种运行环境&＃xff0c;可以在真机下运行&＃xff0c;也可以选择在小程序在微信开发者工具里运行。

谷歌浏览器弹出界面如下&＃xff0c;官方示例模板

4&＃xff1a;总结&＃xff0c;今天把uniapp的文档熟悉了一遍&＃xff0c;得出了很多感悟&＃xff0c;前端发展到现在&＃xff0c;出现了非常多的框架&＃xff0c;有移动端的app&＃xff0c;也有混合式开发&＃xff0c;还有各种小程序&＃xff0c;微信小程序&＃xff0c;支付宝小程序等等&＃xff0c;让人头疼不已。

这个框架的出现解决了相当多的问题&＃xff0c;有两个强大之处&＃xff0c;第一&＃xff0c;开发一套代码&＃xff0c;可以在至少七个平台上运行&＃xff0c;节省了多少开发时间啊&＃xff0c;第二&＃xff0c;组件是真的很强大&＃xff0c;几乎涵盖了前端开发中遇到的所有组件。后面会陆续挖掘其优点。

原文作者&＃xff1a;祈澈姑娘 技术博客&＃xff1a;https://www.jianshu.com/u/05f416aefbe1
90后前端妹子&＃xff0c;爱编程&＃xff0c;爱运营&＃xff0c;文艺与代码齐飞&＃xff0c;魅力与智慧共存的程序媛一枚。
欢迎关注【编程微刊】公众号&＃xff0c;回复【领取资源】,500G编程学习资源干货免费送。