uni-app

介绍

• 一套代码可以发布到IOS、Android、H5、等多个小程序平台
• 即使不跨端，它也是更好的小程序开发工具

环境搭建

• 安装编辑器HbuilderX 下载地址
• 如果需要在小程序上运行，还要下载微信开发者工具 下载地址

不同设备运行

微信小程序

• 如果是第一次使用，需要先配置小程序ide的相关路径，才能运行成功

HbuilderX—>工具—>运行配置找到微信开发者工具配置路径

• 微信开发者工具在设置中安全设置，服务端口开启

微信开发者工具—>设置—>安全设置打开端口

手机或模拟器

• 小米手机需要先进入开发者模式打开USB调试选项，再连接电脑USB，会自动安装一个软件在手机上
• 模拟器运行需要先下载手机模拟器

介绍项目目录

• pages.json 文件用来对 uni-app 进行全局配置，决定页面文件的路径、窗口样式、原生的导航栏、底部的原生tabbar 等
• App.vue是我们的跟组件，所有页面都是在App.vue下进行切换的，是页面入口文件，可以调用应用的生命周期函数。
• pages所有的页面存放目录
• components组件存放目录
• manifest.json 文件是应用的配置文件，用于指定应用的名称、图标、权限等。
• main.js是我们的项目入口文件，主要作用是初始化vue实例并使用需要的插件。
• uni.scss文件的用途是为了方便整体控制应用的风格。比如按钮颜色、边框风格，uni.scss文件里预置了一批scss变量预置。
• unpackage就是打包目录，在这里有各个平台的打包文件
• static静态资源目录，例如图片等