更新记录

0.0.2(2022-11-04) 下载此版本

feature

  • sass/less全局全量示例

bugfix

  • 根据官方文档示例修改 大菠萝引入方式
  • axios 示例代码迭代

chore

  • 依赖版本升级
  • lint优化,移除pnpm强卡控
  • 文档优化

0.0.1(2022-05-22) 下载此版本

首次发布,支持H5,微信小程序,APP(iOS/Android),其它端未测

包含了前端工程化常用能力与Vue3生态相关的能力(Vite,Vitest,Pinia)


平台兼容性

Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.2.16 app-vue app-nvue × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
×

uni-vue3-ts-template

uni-app Vue3 + TypeScript + Vite + Pinia 模板项目

支持小程序,H5,App

图片

H5 微信小程序 App(iOS) App(Android)
图片 图片 图片

其它模板

使用

安装依赖

npm i -g pnpm
pnpm install

本地启动

微信小程序

# 构建出产物
pnpm dev:mp-weixin

然后将编译结果dist/dev/mp-weixin导入微信开发者工具即可运行

点击查看 导入详细步骤 ![图片](https://img.cdn.sugarat.top/mdImg/MTYzNzQxNjc3MjA4Mw==637416772083) ![图片](https://img.cdn.sugarat.top/mdImg/MTYzNzQxNjg4MTUwNA==637416881504) ![图片](https://img.cdn.sugarat.top/mdImg/MTYzNzQxNjY3OTY0NQ==637416679645)

H5

# CSR
pnpm dev:h5
# SSR
pnpm dev:h5:ssr

根据提示,打开对应地址即可访问

图片

App

安装一些必要工具

需要使用 uni-app 官方提供的 HBuilderX 启动项目

Android模拟器在MacOSX、Windows上都可以安装;iOS模拟器只能在MacOSX上安装。

先安装相关模拟器,详细参考文档

准备就绪后,使用 HBuilderX 打开项目

iOS模拟器运行

通过顶部菜单栏,找到运行入口

图片

选择一个目标设备,点击启动即可

图片

Android模拟器运行

这里以夜神模拟器为例

点击查看 详细步骤 先通过 HBuilderX 修改模拟器端口为 `62001` ![图片](https://img.cdn.sugarat.top/mdImg/MTY1MzIxNDAzMjIwNg==653214032206) 打开夜神模拟器 ![图片](https://img.cdn.sugarat.top/mdImg/MTY1MzIxNDA5OTYxNg==653214099616) 选择运行到 Android 基座 ![图片](https://img.cdn.sugarat.top/mdImg/MTY1MzIxNDEzMzI0OA==653214133248) 选择已经打开的模拟器,点击运行即可 ![图片](https://img.cdn.sugarat.top/mdImg/MTY1MzIxNDIxNjczNw==653214216737) ![图片](https://img.cdn.sugarat.top/mdImg/MTY1MzIxMzkyOTQxNg==653213929416)

打包构建

微信小程序

pnpm build:mp-weixin

H5

# CSR
pnpm build:h5
# SSR
pnpm build:h5:ssr

App

基于 HBuilderX 参考官方文档进行进一步的操作

其它更多运行脚本 查看 package.json中的scripts

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问