Vite CLIGetting Started
Overview
Vite-CLI 帮助你快速搭建开箱即用模板 目前 alpha 版本 基于 Vite + Vue3 + Typescript 构建模板， 对模板进行不同程度优化，打造具备基础功能可自定义模板， 自由搭建开发项目
快速开始
- 推荐使用 Pnpm 安装 Vite-CLI .
ts
npx vite-create-app@latest
- 命令行输入
vite查看是否安装成功
Create Vite App
( Rapid iteration of the version ) 🚧🚧
📖 Introduction
Create Vite App resolve Vite create starter template No need to configure Vite scaffolding templates quickly build vite3 development templates highly customized
🌈 Features
⚛️ Support for multiple framework templates
📦 Select the out-of-the-box package manager
🚀 Various characteristics of the corresponding framework
✨ Selection of various Ui frameworks, Theming and layout
🍰 A variety of out-of-the-box Vite plugin options
📦 Installation
ts
npx vite-create-app@latest
🦄 Usage
🤖 Feature Comparison
Currently, the template supports the following plugins The supported template presets are:
FrameWork
| FrameWork | finish |
|---|---|
| Vite3 Vue3 | 🚧 ✅ 🆕 |
| Vite3 React18 | 🚧 ❌ 🆕 |
| Nuxt | 🚧 ❌ |
Feature
| Feature / Version | finish |
|---|---|
| Vue-Router 4.x | ✅ |
| Pinia 2.x | ✅ |
| Eslint 8.x | ✅ |
| Prettier 2.7.x | ✅ |
| TypeScript 4.7.x | ✅ |
| husky | 🚧 ❌ |
| PWA | 🚧 ❌ |
UI Library
| UI Library | finish |
|---|---|
| Element-Plus | ✅ 🆕 |
| Naive-UI | ✅ 🆕 |
| Vuetify-beta5 | ✅ 🆕 |
| DevUI | ✅ 🆕 |
| Ant-design-vue | ✅ 🆕 |
| arco-design | ✅ 🆕 |
| TDesign | ✅ |
| Varlet | ✅ |
| tdesign-mobile-vue | 🚧 ❌ |
| Vant | 🚧 ❌ |
Plugins
| Feature / Version | finish |
|---|---|
| Vue | v3.2.x |
| Vite | v3.0.0 🆕 |
| @vitejs/plugin-vue-jsx | ✅ |
| @vitejs/plugin-legacy | ✅ |
| vite-plugin-inspect | ✅ |
| vite-plugin-pwa | ✅ |
| unplugin-vue-components | ✅ |
| unplugin-auto-import | ✅ |
| Unocss | ✅ |
| rollup-plugin-visualizer | ✅ |
| unplugin-icons | ✅ |
| Vite-plugin-html | ✅ 🆕 |
🛫 Example With Theming
An example of executing dev after successful installation is as follows
- Naive UI
- Ant Design
- Element Plus
- Arco Design
- DevUI
- T-Design
- Vuetify
- Varlet
🌸 Credits