@neosjs/create-app
一个帮助开发者快速创建 Vue3 应用并自动配置项目编译的脚手架。配置完整、格式统一, 有点儿意思……
- ⚡️ Vue 3 + Vue Router (^4.x) + Vite 5 (^5.x)
- 🍍 使用 Pinia 的状态管理 (^2.x) + 数据持久化(^3.x)
- ⛓ 数据请求 (^2.x)
- 📜 支持
H5模版
、PC模版
- 🦾 天然支持 TypeScript (^5.x) -- 默认
- 🔥 使用 新的
<script setup>
语法 - 🤙🏻 默认开启 响应性语法糖
- ⚓ 自带
useAsync
、useLoading
、useOnline
、useWindowSizeFn
等Hooks - 🔖 自带
SvgIcon
组件 - 🎨 UnoCSS - 高性能且极具灵活性的即时原子化 CSS 引擎 (^0.58.x)
- 📥 API 自动加载 - 直接使用 Composition API 无需引入 (^0.17.x)
- 🗂 组件自动化加载 (^0.27.x)
- 📲 PWA (^0.20.x)
- ✅ 移动端 VConsole 功能(^1.3.1),并自动转换
px
为rem
--- H5默认添加 - 🔐 https 开发服务提供证书支持(^1.11.0)
- 🏝 SVG Icons支持 (^2.0.1)
- ⚙️ Vitest 进行单元测试 (^0.26.3)
- 🏞 图片压缩
- 📖 Markdown 支持
- 🌏 国际化支持(默认支持中文简体、英文)
- 🖇 代码提交规范 (^19.x)
- 🧱 代码格式检查,简化Eslint(^9.x)配置,自动修复代码格式 -- 默认
- 💻 统一 VsCode 配置
- 🎉 GitHook 自动化检查提交信息、检查代码
- 📦 自动安装依赖
- 💥 UI库支持:Element Plus、Ant Design Vue、Vant、Tdesign、Arco 等
要使用 @neosjs/create-app
创建一个新的Vue项目,只需在终端运行以下命令:
# npm
npm create @neosjs/app@latest
# yarn
yarn create @neosjs/app@latest
# pnpm
pnpm create @neosjs/app@latest # 推荐使用 pnpm
然后按照提示去做!
为了体验最新的功能,请切记加上
@latest
后缀
您还可以通过其他命令行选项直接指定项目名称和要使用的配置。例如,要构建一个Vue Router + Pinia项目,运行:
# npm
npm create @neosjs/app@latest my-app --pinia --router
# yarn
yarn create @neosjs/app@latest my-app --pinia --router
# pnpm
pnpm create @neosjs/app@latest my-app --pinia --router
推荐使用交互式命令行,以便更好的选择项目配置
-
router
- 引入Vue Router进行单页面应用开发 -
pinia
- 引入Pinia用于状态管理 -
request
- 引入数据请求 -
unocss
- 引入Unocss原子化样式库 -
eslint
- 引入Eslint代码检查 -
pwa
- 引入PWA渐进式Web应用 -
https
- 添加https证书 -
svg-sprite
- 引入SvgSprite图标组件 -
vueuse
- 引入Vueuse工具库 -
vitest
- 添加Vitest进行单元测试 -
git
- 初始化Git -
githooks
(当开启git
时,该参数有效) - 引入用于Git钩子用于自动化 检查提交信息、检查代码 -
h5
- 创建一个H5项目 -
markdown
- 添加Markdown支持 -
devtools
- 添加Devtools支持 -
install
- 自动安装依赖 -
force
- 强制覆盖已存在的目录