Primeiros Passos com Vite+

Vite+ é uma toolchain unificada para desenvolvedores da VoidZero — a empresa fundada por Evan You, criador do Vite e do Vue — que combina Vite, Vitest, Rolldown, Oxlint, Oxfmt, tsdown e Vite Task em uma única CLI chamada vp. O projeto foi anunciado como versão alpha em 13 de março de 2026; a tag alpha foi removida com a v0.1.21 em 13 de maio de 2026, e a versão atual no momento da escrita deste artigo é a v0.1.23 (29 de maio de 2026). O projeto ainda está em pré-1.0, portanto, trate-o como software em estágio inicial, e não como uma stack comprovada para produção — mas ele não é mais alpha, e o fluxo de trabalho central para começar a usar é estável o suficiente para ser utilizado em projetos reais.

Este guia apresenta o processo de instalação do Vite+, criação de um projeto, execução do servidor de desenvolvimento, realização de verificações e testes, geração de um build de produção e compreensão de como o vp se encaixa em um fluxo de trabalho frontend típico.

O que é o Vite+, de fato

Vite+ é uma distribuição de CLI que agrupa um conjunto selecionado de ferramentas frontend em um único ponto de entrada. Cada componente é um projeto existente, não uma nova invenção: Vite 8 como servidor de desenvolvimento, Rolldown como bundler de produção baseado em Rust e compatível com a API do Rollup, Vitest como test runner, Oxlint e Oxfmt como linter e formatter construídos sobre a infraestrutura do compilador Oxc, tsdown para bundling de bibliotecas e Vite Task para orquestração de tarefas e cache em monorepos.

Os ganhos de desempenho entre essas ferramentas são estruturais, não aditivos: Rolldown, Oxlint e Oxfmt compartilham o Oxc — a infraestrutura de compilador JavaScript baseada em Rust da VoidZero — como uma camada comum de parsing e transformação. A melhoria de velocidade vem do fato de o motor subjacente ser rápido uma única vez, em vez de cada ferramenta ser otimizada de forma independente.

O Vite+ complementa o Vite em vez de substituí-lo. Se você já usa o Vite, pode adotar o Vite+ de forma incremental; se não usa, o Vite+ não é o ponto de entrada que você deseja.

Pré-requisitos

Antes de instalar, confirme se seu ambiente atende aos requisitos de runtime do Vite 8. O Vite 8 requer Node.js 20.19 ou superior, ou Node.js 22.12 ou superior — o Vite+ não substitui o Node.js, ele gerencia qual versão do Node.js seu projeto utiliza por meio do vp env. Executar o Vite+ em uma versão mais antiga do Node.js resultará em erro antes mesmo de o servidor de desenvolvimento iniciar.

Você também precisa de um shell compatível com POSIX no macOS ou Linux, ou PowerShell no Windows.

Instalando o Vite+

O Vite+ é instalado como um único binário chamado vp. No macOS ou Linux:

curl -fsSL https://vite.plus | bash

No Windows PowerShell:

irm https://vite.plus/ps1 | iex

Reinicie o terminal e verifique a instalação:

vp --version
vp help

Durante a instalação, o Vite+ pergunta se deve gerenciar o runtime global do Node.js. Se você já usa nvm, fnm ou asdf, pode recusar o modo gerenciado e o Vite+ irá delegar ao Node.js do seu sistema. Você pode alternar essa configuração posteriormente com vp env on ou vp env off.

Criando seu primeiro projeto

vp create cria um novo projeto a partir de um template do Vite+, solicitando interativamente o framework, o gerenciador de pacotes e a escolha entre TypeScript ou JavaScript:

vp create

O prompt interativo permite escolher um template (Vite, Vue, Svelte, Nuxt, Next.js, React Router ou TanStack Start), um gerenciador de pacotes (npm, pnpm, yarn, bun) e TypeScript ou JavaScript. Para pular o prompt, passe o nome de um template:

vp create vue my-app
cd my-app
vp install

O projeto criado produz um único vite.config.ts que irá conter a configuração de todas as ferramentas da cadeia — o linter, o formatter, o test runner e os hooks de arquivos staged leem a partir deste arquivo.

Executando o servidor de desenvolvimento com vp dev

vp dev inicializa o servidor de desenvolvimento do Vite 8 com as configurações padrão — nenhuma flag é necessária para o caso comum:

vp dev

vp dev inicia o servidor de desenvolvimento do Vite 8 diretamente. Ele não executa o script dev do seu package.json — esse é um ponto de confusão comum, e é o inverso do comportamento de npm run dev. Se o seu projeto tiver um script dev personalizado (por exemplo, um que execute um processo de backend simultaneamente com o frontend), invoque-o explicitamente:

vp run dev

A mesma regra se aplica a vp test e vp build: esses são comandos integrados que roteiam pelas ferramentas integradas do Vite+. vp run <script> é a saída de emergência para scripts arbitrários do package.json, e também obtém o cache com reconhecimento de entradas do Vite Task quando invocado com --cache.

O vite.config.ts unificado

O Vite+ consolida a configuração de todas as ferramentas que envolve — Vite, Vitest, Oxlint, Oxfmt e hooks de arquivos staged — em um único vite.config.ts na raiz do projeto. Em vez de manter arquivos separados como .eslintrc, .prettierrc e vitest.config.ts, você expressa tudo por meio de uma única chamada tipada ao defineConfig.

Uma configuração mínima tem a seguinte aparência:

import { defineConfig } from 'vite-plus'

export default defineConfig({})

Em seguida, você pode adicionar configurações para ferramentas individuais conforme seu projeto cresce:

import { defineConfig } from 'vite-plus'

export default defineConfig({
  fmt: {
    singleQuote: true,
    semi: false,
  },
  lint: {
    ignorePatterns: ['dist/**'],
  },
  test: {
    include: ['src/**/*.test.ts'],
  },
})

O Vite+ também suporta verificações de arquivos staged por meio de um bloco de configuração staged:

import { defineConfig } from 'vite-plus'

export default defineConfig({
  fmt: { singleQuote: true, semi: false },
  lint: { ignorePatterns: ['dist/**'] },
  test: { include: ['src/**/*.test.ts'] },
  staged: {
    '*.{js,ts,tsx,vue,svelte}': 'vp check --fix',
  },
})

Para habilitar verificações no momento do commit, instale os hooks do Git:

vp config

Após isso, o Vite+ executa automaticamente as tarefas configuradas para arquivos staged durante os commits via vp staged, sem exigir configuração separada do Husky ou do lint-staged.

Assim como o restante do Vite+, o sistema de configuração ainda está evoluindo enquanto o projeto permanece em pré-1.0. Se você estiver adotando novas versões, vale a pena verificar a documentação oficial e as notas de versão para identificar mudanças na configuração antes de atualizar.

Executando verificações com vp check

vp check executa formatação, linting e verificações com reconhecimento de tipos em uma única passagem no projeto atual:

vp check

Para corrigir automaticamente o que pode ser corrigido com segurança:

vp check --fix

--fix lida com a maior parte da formatação e muitas regras de lint, mas não consegue corrigir erros de tipo ou bugs de lógica. Trate-o como um autocorretor, não como um substituto para revisão. As verificações de tipo são realizadas pelo tsgolint (um linter com reconhecimento de tipos construído sobre a toolchain TypeScript Go), e não por uma compilação completa com tsc --noEmit — rápido para detectar erros de tipo comuns, mas não um substituto para o tsc em CI se você exigir compilação de tipos exaustiva. Como Oxlint, Oxfmt e tsgolint compartilham a infraestrutura alinhada ao Oxc, o vp check é notavelmente mais rápido do que uma cadeia equivalente de ESLint + Prettier + tsc --noEmit na mesma codebase.

Executando testes com vp test

vp test executa a suíte do Vitest uma única vez e encerra — o Vite+ inverte o comportamento padrão nativo do Vitest de permanecer em modo watch, tornando esse comportamento opcional:

vp test                  # executa uma vez (Vite+ não usa watch por padrão, ao contrário do Vitest)
vp test watch            # entra em modo watch
vp test run --coverage   # execução única com cobertura

vp test invoca o Vitest usando o bloco test no vite.config.ts. Note que isso inverte o comportamento padrão nativo do Vitest — executar vp test sozinho encerra após uma única passagem, enquanto o vitest standalone permaneceria em modo watch. Como o Vitest já compartilha o pipeline de transformação do Vite, não há um vitest.config.ts separado para manter — o mesmo defineConfig cobre ambos.

Gerando um build de produção com vp build

vp build compila um bundle de produção usando Vite 8 e Rolldown, emitindo para dist/ com as mesmas convenções do vite build:

vp build

vp build compila um bundle de produção usando Vite 8 e Rolldown. A saída vai para dist/ seguindo as mesmas convenções do vite build. Como o Rolldown é projetado para ser compatível com a API do Rollup, os plugins existentes do Rollup devem continuar funcionando — embora os autores de plugins ainda estejam corrigindo casos extremos, portanto, verifique quaisquer plugins personalizados em uma branch antes de depender do vp build para releases.

Para fazer cache das entradas do build entre execuções em um monorepo:

vp run --cache build

O Vite Task cria uma impressão digital das entradas declaradas e ignora os pacotes cujas entradas não foram alteradas em execuções subsequentes. Esse é o mesmo problema de fluxo de trabalho que o Turborepo resolve, integrado à toolchain em vez de adicionado por cima.

Um modo de falha comum em produção ao trocar de bundler é a regressão silenciosa de source maps. Antes de fazer o deploy de uma saída do vp build, verifique se os stack traces na sua ferramenta de monitoramento de erros ou de session replay ainda resolvem para os arquivos-fonte originais — esse é um dos problemas de migração de ferramentas de build mais frequentes que o OpenReplay identifica em dados de sessões reais.

Referência de comandos do vp

Referência atualizada para o Vite+ v0.1.23 (29 de maio de 2026).

Integrando o Vite+ ao GitHub Actions

Para CI, a VoidZero publica a action voidzero-dev/setup-vp, que instala a CLI vp e, opcionalmente, faz cache das dependências. Um workflow mínimo:

name: CI
on: [push, pull_request]
jobs:
  ci:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: voidzero-dev/setup-vp@v1
        with:
          node-version: '22'
          cache: true
      - run: vp install
      - run: vp check
      - run: vp test
      - run: vp build

Isso substitui etapas separadas de lint, formatação, verificação de tipos e build por quatro invocações do vp que leem do mesmo vite.config.ts que seus desenvolvedores usam localmente.

O que saber antes de adotar

Algumas ressalvas honestas sobre a versão atual:

• O Oxfmt ainda está em pré-1.0. Compare sua saída com a sua baseline existente do Prettier em uma branch antes de migrar codebases de produção.
• Os ecossistemas de frameworks ainda têm suas próprias convenções. Embora o Vite+ possa criar projetos para frameworks como Nuxt e TanStack Start, a configuração e os fluxos de trabalho específicos de cada framework podem continuar existindo fora do modelo de configuração unificada do Vite+.
• Pré-1.0 significa que mudanças incompatíveis são possíveis. Fixe a versão do vp no CI e leia o changelog do Vite+ antes de atualizar.

Próximos passos

Instale o Vite+ em um projeto paralelo esta semana, execute vp check uma vez e observe como é a sua toolchain quando seis ferramentas respondem a um único comando. Se essa experiência se confirmar, experimente vp migrate em um projeto Vite não crítico e revise o diff antes de fazer o merge — a migração é rápida, mas a revisão é onde você identifica os casos extremos.

Perguntas Frequentes

Gain Debugging Superpowers

Unleash the power of session replay to reproduce bugs, track slowdowns and uncover frustrations in your app. Get complete visibility into your frontend with OpenReplay — the most advanced open-source session replay tool for developers. Check our GitHub repo and join the thousands of developers in our community.