Getting Started
Overview
Vite-CLI 帮助你快速搭建开箱即用模板 目前 alpha 版本 基于 Vite + Vue3 + Typescript 构建模板, 对模板进行不同程度优化,打造具备基础功能可自定义模板, 自由搭建开发项目
快速开始
- 推荐使用 Pnpm 安装 Vite-CLI .
ts
npx create-vite-template@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 create-vite-template@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