Skip to content
jatin.sharma
← All projects

04 · Developer tool · npm CLI

RTL-Migrate

A published CLI and codemod that migrates physical LTR CSS and CSS-in-JS properties to CSS logical properties, so layouts work in RTL.

GitHub npm

Problem

Supporting right-to-left languages in a large codebase means touching thousands of marginLeft, paddingRight and left/right declarations. Doing it by hand is slow and error-prone, and a blind find-and-replace breaks layouts.

What I built

  • A CLI, rtlmigrate, published to npm as rtl-migrate-cli.
  • AST-based rewriting of JS/TS style objects with Babel and recast, so untouched code keeps its formatting.
  • PostCSS-based rewriting for CSS and SCSS files.
  • Dry run by default: it prints a diff and only writes files with an explicit flag.

Architecture

  1. Glob of files

  2. Parse

    Babel / PostCSS

  3. Heuristics

    skip centering, overlays

  4. Rewrite

    recast

  5. Diff or write

Engineering decisions

Heuristics over blind replacement
left and right are only converted when they look directional. Centering such as left: 50%, full-overlay positioning with all four edges at zero, and off-screen hiding are left alone.
Understand direction conditionals
Ternaries such as direction === 'ltr' ? a : b collapse to the logical value, and 4-value margin or padding shorthands are split correctly.
Safe to run on a real repo
Diff-first output and preserved formatting make the changes reviewable like any other pull request.

Technology

  • Node.js
  • Babel
  • recast
  • PostCSS
  • Commander
  • Vitest
  • npm

Result

Published on npm: a repetitive, error-prone manual migration turned into a reviewable codemod.