持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第4天，点击查看活动详情
uniapp概览
当下随着小程序的种类越来越多，前端开发者开发多端应用的任务和工作量越来越繁重，uniapp为了解决这个问题，提供了一套代码实现多端发布的解决方案。在uniapp中，用户使用Vue和uniapp提供的API混合的语法编写一套代码，经过编译以后可以在Web、各种小程序乃至安卓和ios端发布。
uniapp使用
通过HbuilderX
- 下载HbuilderX
- 进入HbuilderX后选择文件->新建->项目，选择uniapp
- 确定项目路径、名称、模板、Vue版本等信息
- 接下来点击运行，选择目标终端，注意要先配置好本地的终端位置。
通过命令行
-
首先安装Vue-cli
-
npm install -g @vue/cli@4
-
-
创建项目
-
vue create -p dcloudio/uni-preset-vue my-project
-
-
运行发布PLATFORM即对应的终端
-
npm run dev:%PLATFORM% npm run build:%PLATFORM%
-
uniapp基本使用
全局文件
-
pages.json
- 用来注册和配置每个页面及其对应的样式
-
manifest.json
- 文件是应用的配置文件，用于指定应用的名称、图标、权限等。HBuilderX 创建的工程此文件在根目录，CLI 创建的工程此文件在 src 目录。
-
package.json
- 在开发小程序和web端时进行的扩展配置。
标签(组件)
-
uniapp虽然使用Vue语法，但使用的并非原生HTML组件，而是类似小程序的组件。这里展示3个常用组件。
组件 含义 view 视图容器。它类似于传统html中的div，用于包裹各种元素内容。 text 行内文本组件。 navigator 类似a标签，但是只能跳转到在page.json中注册的页面
-
扩展组件
- 可以通过uniapp的插件市场使用别人封装好的一些组件来提高工作效率
- 我们首先进入插件市场，选择一个想要的插件，随后点击使用HbuilderX导入插件，根据指引即可导入项目。
API
-
虽然uniapp集成Vue语法，但部分Vue功能并不支持
-
uniapp使用的API类似小程序，这里举出几个例子
API 功能 uni.request() 发起网络请求 uni.navigateTo() 跳转到指定页面 uni.setStorage() 本地存储 uni.chooseImage() 用户选择图片
其他
uniapp虽然提供了多端发布的能力，但每个端的能力不同，很多时候开发人员仍然要进行条件编译来满足不同平台的问题，并且uniapp本身也存在一些性能和调试的bug，但依然是一款非常好用的国产开发解决方案。
