vitesse

Vitesse é um template inicial altamente opinativo para construir aplicações web com Vite e Vue 3, criado por Anthony Fu. Ele visa fornecer uma configuração rápida e pré-configurada para que desenvolvedores possam transformar ideias em aplicativos funcionais sem gastar tempo com configuração. O template é projetado para velocidade, aproveitando ferramentas modernas como pnpm, esbuild e Vite, e inclui um conjunto selecionado de recursos e plugins prontos para uso. **Recursos Principais** - **Vue 3 + Vite**: Construído com o Vue 3 mais recente e Vite para tempos rápidos de desenvolvimento e build. - **Roteamento Baseado em Arquivos**: Usa `unplugin-vue-router` para geração automática de rotas a partir do diretório `src/pages`. - **Auto-importações**: Componentes, APIs (ex.: Composition API) e ícones são auto-importados, reduzindo código boilerplate. - **Gerenciamento de Estado**: Pinia para gerenciamento de estado intuitivo e type-safe. - **Sistema de Layouts**: Suporta múltiplos layouts via `vite-plugin-vue-layouts`. - **Suporte a PWA**: Integrado com `vite-plugin-pwa` para capacidades de progressive web app. - **Estilização**: UnoCSS para CSS atômico instantâneo sob demanda, com suporte a qualquer conjunto de ícones via Iconify. - **Internacionalização**: Vue I18n com `unplugin-vue-i18n` para suporte a múltiplos idiomas. - **Markdown**: Escreva Markdown como componentes Vue usando `unplugin-vue-markdown` com realce de sintaxe Shiki. - **SSG**: Geração de site estático via `vite-ssg`, com otimização de CSS crítico usando `beasties`. - **Testes**: Vitest para testes unitários e Cypress para testes E2E, integrados com GitHub Actions. - **TypeScript**: Suporte completo a TypeScript. - **Deploy**: Deploy sem configuração para Netlify, além de suporte a Docker para builds de produção. **Plugins Pré-incluídos** - Vue Router, Pinia, VueUse, Unhead para gerenciamento de head, e `vite-plugin-vue-devtools` para experiência de desenvolvimento aprimorada. - Estilo de código aplicado com ESLint usando `@antfu/eslint-config` (aspas simples, sem ponto e vírgula). - Extensões VS Code recomendadas para Vite, Volar, Iconify IntelliSense, i18n Ally e ESLint. **Variações** O template inspirou várias variações mantidas pela comunidade, incluindo: - `vitesse-lite`: Versão leve. - `vitesse-nuxt3`: Para Nuxt 3. - `vitesse-webext`: Para extensões de navegador. - `vitesse-ssr-template`: Com suporte a SSR. - `vitailse`: Com TailwindCSS. - `vitesse-h5`: Para aplicativos móveis. - `vitesse-solid`: Para SolidJS. **Uso** - **Desenvolvimento**: Execute `pnpm dev` e visite `http://localhost:3333`. - **Build**: Execute `pnpm build` para gerar uma pasta `dist`. - **Deploy**: Faça deploy para Netlify conectando o repositório, ou use Docker com `docker buildx build . -t vitesse:latest` e execute com `docker run --rm -it -p 8080:80 vitesse:latest`. **Nota**: O autor recomenda usar Nuxt para novos projetos devido à melhor experiência de desenvolvimento Vue e manutenção mais consistente, pois Vitesse é do período inicial de transição Vite/Vue 3 e as atualizações podem ser mais lentas. No entanto, continua sendo uma referência sólida para aprendizado e para projetos que se alinham com sua configuração opinativa. **Checklist para Personalização** Ao usar o template, atualize o nome do autor no `LICENSE`, o título no `App.vue`, o hostname no `vite.config.ts`, o favicon em `public`, remova a pasta `.github` e limpe os READMEs e rotas. No geral, Vitesse é um template inicial poderoso e rico em recursos para desenvolvedores que desejam uma configuração abrangente e opinativa para aplicativos Vue 3, com foco em velocidade e experiência de desenvolvimento.