简介
HBuilderX 3.3.0+
更新uni-app编译器,支持基于 Vite 编译到小程序平台。
至此,uni-app
在App/H5/小程序
全平台支持Vue 3.0
开发,且全平台支持Vite
编译器,下载 HBuilderX 3.3.0+ 体验。
Tips:
- H5/PC Web 平台:hello-uniapp H5 端已迁移 vue3,点击体验
除支持 vue3
语法特性外,uni-app
特有的生命周期钩子支持 Composition API
,如 onLaunch
,onShow
,onLoad
... ,使用方法见 Vue2 迁移 Vue3 文档
HBuilderX创建支持 vue3 的 uni-app 项目
从 HBuilderX 3.3.0+ 起,支持创建 vue3 的 uni-app 项目,一套代码运行到多端:
-
创建一个 uni-app 项目
-
在项目的 manifest 的「基础配置」中切换 「vue 版本选择」,默认是 vue2,切换为 vue3 即可
cli 创建支持 vue3 的 uni-app 项目
-
创建 Vue3/Vite 工程
# 创建以 javascript 开发的工程 npx degit dcloudio/uni-preset-vue#vite my-vue3-project # 创建以 typescript 开发的工程 npx degit dcloudio/uni-preset-vue#vite-ts my-vue3-project
-
进入工程目录
cd my-vue3-project
-
安装依赖
npm i 或 yarn
-
运行
# 运行到 h5 npm run dev:h5 # 运行到 app npm run dev:app # 运行到 微信小程序 npm run dev:mp-weixin
-
打包
# 打包到 h5 npm run build:h5 # 打包到 app npm run build:app # 打包到 微信小程序 npm run build:mp-weixin
更新依赖版本
参考:https://uniapp.dcloud.net.cn/quickstart-cli.html#cliversion
从 vue2 迁移到 vue3
请参看官方文档从 vue2 迁移到 vue3
注意事项
- vue3 响应式基于 Proxy 实现,不支持iOS9和ie11。vue3 中文文档。
- 暂不支持新增的 Teleport,Suspense 组件。
- 在 Vue3 中, 处理 API
Promise 化
调用结果的方式不同于 Vue2。更多- Vue3 中,调用成功会进入 then 方法,调用失败会进入 catch 方法
- Vue2 中,调用无论成功还是失败,都会进入 then 方法,返回数据的第一个参数是错误对象,第二个参数是返回数据
欢迎开发者反馈使用该版本遇到的问题,我们将积极收集意见。