🎉🎉🎉2024年末重磅推出更懂你的uni-app框架！！！

🌿 前言

在去年写了一篇关于【uniApp新模式: 使用Vue3 + Vite4 + Pinia + Axios技术栈构建】的文章，反馈还不错，所以一直想抽个时间把这个弄成框架模版开源出来！后面断断续续的开发，今天终于发布了第一个版本🎉🎉🎉，欢迎体验~

🌴 介绍

snail-uni - 专为开发者打造的 Uni-App 框架模板。基于 UniApp + Vue3 + TypeScript + Vite + Wot Design Uni 的高效框架模板。它内置了 Snail-Uni 脚手架工具，帮助您快速创建 TypeScript 或 JavaScript 版本项目。Snail-Uni 配备了丰富的开箱即用配置，让您从一开始就拥有高效的开发体验。

💻 特性

使用 Vue3 + Vite5 + Ts 等最新技术栈构建
采用 pnpm + Monorepo 模式构建
路由自动注册，无需手动配置路由，同时集成了Uni Mini Router路由插件系统
集成 Oxlint + Eslint 最新的代码规范，更高效的检测代码质量
宇宙最强编辑器Vscode，告别HBuilderX
支持uni-app、vue3、pinia、uni mini router自动导入
支持微信云开发（后续更新）

✍️ 前置准备

Node.js 18 及以上版本
pnpm - >=8.15.6（推荐使用 9.0.0）
VSCode 开发工具下载
HBuilderX - APP 的运行和发布需要
Git 安装

Snail-uni 要求 Node.js 版本 18+ 或者 20+. 请注意升级你的 Node.js 版本！否则会导致项目无法正常运行！

🌿 使用

snail-uni 附带一个命令行创建向导，可以帮助你构建一个基本项目。支持创建 js 与 ts 让你无需纠结。

bash 复制代码

# npm
npm create snail-uni
# pnpm
npm create snail-uni
# yarn
yarn create snail-uni
# bun
bun create snail-uni

将需要回答几个简单的问题：

你还可以通过附加的命令行选项直接指定项目名称和你想要使用的模板, 例如：不指定类型默认为 js 版本且其他都默认关闭！支持两种创建语法：

🌱 方式一

npm create snail-uni <project-name> --t <template-name 模板名称> --ui <ui库（Wot-Design/Uv-ui/Uview-plus/TuniaoUI> --lint <yes/no）>

sh 复制代码

# npm
npm create snail-uni my-snail-app --t uni-ts --ui Uv-ui  --lint yes
#pnpm
pnpm create snail-uni my-snail-app --t uni-ts --ui Uv-ui  --lint yes
#yarn
yarn create snail-uni my-snail-app --t uni-ts --ui Uv-ui  --lint yes
#bun
bun create snail-uni my-snail-app --t uni-ts --ui Uv-ui  --lint yes

支持以下模板：uni-ts、uni-tabbar-ts、uni-js、uni-tabbar-js
支持以下ui库：Wot-Design、Uv-ui、Uview-plus、TuniaoUI

🌱 方式二

npm create snail-uni <project-name> <语言类型（js/ts）> <是否使用（tabbar/no)> <是否使用代码检查（eslint/no）> <ui库（Wot-Design/Uv-ui/Uview-plus/TuniaoUI）>

sh 复制代码

#npm 
npm create snail-uni snail-uni-app ts tabbar eslint
#pnpm
pnpm create snail-uni snail-uni-app ts tabbar eslint
#yarn
yarn create snail-uni snail-uni-app ts tabbar eslint
#bun
bun create snail-uni snail-uni-app ts tabbar eslint

执行完之后，将生成一个uni-app的项目,使用vscode开发工具打开

💻 启动并运行

snail-uni 启动运行脚本在package.json中配置：

json 复制代码

{
  ...
  "scripts": {
    "dev": "uni -p mp-weixin",
    "dev:h5": "uni",
    "build": "uni build -p mp-weixin",
    "build:h5": "uni build"
    ...
  },
  ...
}

dev 脚本将启动具有即时热更新的本地开发服务器。使用以下命令运行它：

默认启动微信小程序,根据自己需求在package.json 中进行调整