Skip to main content
LucasBartroli.Dev
Back to blog

From Webpack to Vite without stopping the world

vitewebpackmigrationtypescript

At Blameless I helped move a large production frontend from Webpack 4 to Vite 4, alongside ESLint → Biome and a long JavaScript → TypeScript migration. None of those are weekend chores on a real app.

Sequence beats heroics

We didn’t flip every switch at once. The order that worked:

  1. Vite for local/CI builds with a compatibility shim where needed
  2. Linter/formatter swap once the build was stable (Biome was a large DX win)
  3. TypeScript expansion by directory, not “convert the monorepo tomorrow”

Each step had to leave main releasable.

What actually blocked us

  • Plugins and custom loaders with no Vite equivalent
  • Implicit global CSS ordering that Webpack accidentally preserved
  • Tests that assumed a particular bundle shape

Document those early. Migrations die when surprises land in the last week.

The TypeScript lesson

Migrating syntax is easy; migrating types at the boundaries (API clients, shared utils, window globals) is the work. We preferred incremental allowJs islands over a giant bang-convert that stalled feature delivery.

Takeaway

Tooling migrations succeed when they’re boring: small PRs, measured wins, and a team that can still ship product the same week.