vue-awesome-template
vue-awesome-template copied to clipboard
☀Opinionated Vue3 Starter Template
vue-awesome-template
💥 Important!!! The old template
cli-2.xand[email protected]are archived,please check the guide below.
- If you use
[email protected]and[email protected],please check branch cli-2.x - If you use
[email protected]and[email protected],please check branch [email protected]
Recommended IDE Setup
VSCode + Volar (and disable Vetur) + TypeScript Vue Plugin (Volar).
Type Support for .vue Imports in TS
TypeScript cannot handle type information for .vue imports by default, so we replace the tsc CLI with vue-tsc for type checking. In editors, we need TypeScript Vue Plugin (Volar) to make the TypeScript language service aware of .vue types.
If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a Take Over Mode that is more performant. You can enable it by the following steps:
- Disable the built-in TypeScript Extension
- Run
Extensions: Show Built-in Extensionsfrom VSCode's command palette - Find
TypeScript and JavaScript Language Features, right click and selectDisable (Workspace)
- Run
- Reload the VSCode window by running
Developer: Reload Windowfrom the command palette.
TODO
- [x] 约束镜像源和
npm、node、pnpm版本 - [x] 仅允许使用
pnpm - [x]
Eslint+prettierready - [x]
vite配置拆分 - [x] 集成
tailwindcss - [x] 构建
gzip - [x] 多构建环境区分
- [x] 目录分层
- [x]
TS支持 - [x]
html支持env变量 - [x] 支持三方包拆分到独自的
chunk中 - [ ] 主题化
- [ ]
svg集成 - [ ]
vueuse集成 - [ ]
TSX支持 - [x]
Vue3API自动导入支持 - [x] 深色模式支持
- [x]
Inspect调试支持 - [ ] 组件模板生成/移除
- [ ]
i18n支持 - [x] 支持
event-bus(基于EventEmitter3) - [x] 自定义
import语句顺序 - [x] 支持
CI构建,可通过pnpm build:prod -- --ciVersion 1.1.1添加构建版本号 - [x]
swagger转ts类型文件并自动生成request文件