Simple, opinionated, fully typed, and production-ready project template for Vite.
This template is practical and batteries included but not overly complex or bloated. Also explicit configuration over magic; it should be easy to understand how everything works, strip out anything you don't need, and fast to modify things to your needs.
Includes plenty of examples and documentation of how to do things but minimal cruft to delete to get you going.
Please check out the homepage for full docs. A detailed changelog is available. This repository is also mirrored on GitLab.
- Vue 3.2
- Pinia store (fully typed Vuex store is available up to version 1.13)
- Routing using vue-router 4
- TypeScript 4.7
- Automatic package and component imports w/ unplugin-auto-import and unplugin-vue-components
- Tailwind CSS 3 w/ following plugins and configuration preinstalled:
@tailwindcss/aspect-ratio
@tailwindcss/line-clamp
@tailwindcss/typography
@tailwindcss/forms
firefox
-variant
- PostCSS 8 w/
postcss-nesting
plugin andcssnano
for minimizing production CSS - Eslint
- Prettier
- Alias
@
to<project_root>/src
- Predefined and fully typed global variables:
VITE_APP_VERSION
is read frompackage.json
version at build timeVITE_APP_BUILD_EPOCH
is populated asnew Date().getTime()
at build time
- Using newest
script setup
syntax w/ Ref sugar (see the official Script Setup documentation and Ref Sugar RFC discussion) - Vitest unit tests
- Playwright e2e + component tests
- GitHub workflows
- Renovatebot for keeping up with dependencies
- Automated unit tests
- Automated component tests
- Automated e2e tests
- GitLab CI config available up to versions 2.x
- Follow @uninen on Twitter
- Read my continuously updating learnings from Vite / Vue / TypeScript and other Web development topics from my Today I Learned site
Contributions are welcome! Please follow the code of conduct when interacting with others.