Vite+
The Unified Toolchain for the Web.
Vite+ Manage your runtime, package manager, and frontend stack with one tool.
Why Vite+?
Instead of learning a different combination of tools and commands in every repository, developers can use a consistent workflow:
- vp dev — start a development server with hot module replacement, powered by Vite 8.
- vp check — format your code with Oxfmt, lint it with Oxlint, and type check it at once.
- vp test — run unit tests powered by Vitest.
- vp build — build your project for production, powered by Vite 8.
- vp pack — bundle libraries with best practices baked in, powered by tsdown.
- vp run — run any npm script or task through the built-in monorepo-aware task runner with intelligent caching.
We are using Vite+ Monorepo project structure
- The root
vite.config.tsconsist shared linting, formatting, testing, staged checks, and task definitions. For project-specific dev server, development, build, and preview behavior, use sub module specificvite.config.tsfile i.e.,apps/web/vite.config.tsetc
Quick Start
Create a project, install dependencies, and use the default commands:
vp create # Create a new project
vp install # Install dependencies
vp dev # Start the dev server
vp check # Format, lint, type-check
vp test # Run JavaScript tests
vp build # Build for productionOptions
flag is available for all commands
-r, --recursive # Select all packages in the workspace
-t, --transitive # Select the current package and its transitive dependencies
-w, --workspace-root # Select the workspace root package.
-v, --verbose # Show full detailed summary after execution.Root Workspace Commands
[!TIP] Pass a folder to built-in Vite commands when you want to target one app:
vp dev apps/web # starts the `web` dev server powered by Vite.
vp check # runs format, lint, and type checks together.
vp check --fix # runs format, lint, and type checks together and fix
# `vp lint`, `vp fmt`, and `vp test` let you run those tools directly.
vp staged # o run checks against the files currently staged in Git
vp run -r clean # remove all generated directories and node_modules
vp run -r build # builds all apps.
vp run -r preview # previews the production build locally.
vp env doctor # check vite+ is setup properly
vp cache clean # when you need to clear cached task results.
vp env clean # to remove unused managed Node.js runtimes and package-manager caches
# The task cache is stored in `node_modules/.vite/task-cache`Testing
[!IMPORTANT] The snapshot artifact (
__snapshots__) should be committed alongside code changes, and reviewed as part of your code review process.
vp test
vp test watch
vp test path/to/file.test.ts # run a single test file
vp test -t "renders correctly and matches snapshot" # run tests whose name matches
vp test --coverage
vp test watch --uiif you want to add new app module to apps/, run this command from project root
vp create @tanstack/startif you want to add new library module to packages/, run this command from project root
vp create vite:librarySub Module Commands
vp dev apps/web
vp build apps/web
vp preview apps/web
vp run @workspace/db#studio
vp run @workspace/db#generate
vp run @workspace/db#migrate
vp run @workspace/db#seedManage Dependencies
wrap package-manager workflows
vp add, vp remove, vp update, vp dedupe, vp outdated, vp why, and vp info
vp install --filter web # scopes install work in monoreposMaintain
vp upgradeupdates the vp installation itself.vp imploderemoves vp and related Vite+ data from your machine.
References
Last updated on