uni-app学习日记day1-----安装IDE、新建项目及目录结构分析

uni-app作为近年异军突起的前端框架，号称兼容10个平台，一套代码多端运行。

官方文档地址：https://uniapp.dcloud.io/
听起来十分的不错，这样可以大大减少公司和开发者的时间和金钱成本。因此很多的公司企业也都把uni-app列入了招聘技术要求。
我从今天开始也入坑一波，把自己学到的和踩的坑和大家分享一下。因为我之前是做微信小程序的，所以我也会把uniapp和微信小程序原生开发的异同点对比一下。
首先，无论是什么语言，什么框架，都需要一个得力的编辑器辅助我们完成代码的编写及调试。
uni-app官方推荐的是HbuilderX作为主要编辑器，Hbuilder和uniapp都是DCloud旗下的产品，它自然会把HbuilderX各种东西调试兼容的很好，所以目前，我打算先用这个。
https://www.dcloud.io/hbuilderx.html这是HbuilderX官方下载地址。
然后我建议再下载一个微信开发者工具，方便调试
https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html这是微信开发者工具的下载地址。
然后我们进入HbuilderX的可视化界面，新建一个uniapp项目。

新建完成之后，目录结构如下：

pages文件夹存放的就是我们要编写的所有页面。
static文件夹是我们要上线打包时用到的，在开发中基本不用。
App.vue是设置全局样式的，类似于微信小程序的app.js/app.wxss，manifest.json也是调试上线时需要用到的，比如app的图标等。
pages.json类似于微信小程序的app.json，设置全局的tabbar及页面注册等功能。
uni.scss是官方为我们封装的一些样式库。
ok，然后我们点击运行一下，点顶部的运行之后，可以选择浏览器、手机模拟器、小程序模拟器，大家可以都一一尝试一下，手机模拟器的话，需要在手机上下载对接的软件，插上USB后它会有提示。小程序模拟器必须下载对应的IDE才能打开，而已大部分都需要打开一下端口。
H5端的运行效果如下：

我没有看官方文档，自己敲了一些代码，个人感觉uniapp开发起来像是vue和小程序的结合，搞笑的事情是，我就随便试了一个微信小程序的API，把前缀wx.改成了uni.，然后就可以正常使用，功能一摸一样。哈哈哈。所以，如果有vue和小程序的开发经验的话，uniapp学起来应该比较轻松。

有任何问题都可以联系QQ：505417246
微信小程序云开发零基础QQ交流群：1073011570