Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Webpack to Vite Codemods
# chmod +x to make this file executable
# installing codemods
# NO NEED; ALREADY ON MASTER - (manual action)
# yarn route-manager add -D npm-run-all @vitejs/plugin-react-refresh vite vite-tsconfig-paths
# NO NEED; ALREADY ON MASTER - (manual action)
# cherrypick commits from vite branch
# remove node_modules, avoid the following codemods to alter vendor code
echo "Remove node_modules (it takes a while)"
find . -name "node_modules" -exec rm -rf '{}' +
# replace aliases pointing to files (idempotent codemod)
codemod -m -d . --extensions ts,tsx --accept-all \
"'@(defaultIntlV2Messages|defaultIntlV3Messages|components/layout|features/domain|features/domain/territory|features/domain/driver|features/domain/ui|features/domain/order|features/domain/user|features/domain/history|features/domain/mapMarkers|app|atoms|dev|intl|routing|sections|services|styles|store|utils|hooks|map|forms|icons|server-data|journal)'" \
codemod -m -d . --extensions json --accept-all \
'"@(defaultIntlV2Messages|defaultIntlV3Messages|components/layout|features/domain|features/domain/territory|features/domain/driver|features/domain/ui|features/domain/order|features/domain/user|features/domain/history|features/domain/mapMarkers|app|atoms|dev|intl|routing|sections|services|styles|store|utils|hooks|map|forms|icons|server-data|journal)"' \
# replace aliases pointing to directories (idempotent codemod)
codemod -m -d . --extensions ts,tsx --accept-all \
"'@(resources|lib|components|features|local/server-data|local/components|local|local/hooks|local/table-gl|local/journal|journal|local/journal)/" \
codemod -m -d . --extensions json --accept-all \
'"@(resources|lib|components|features|local/server-data|local/components|local|local/hooks|local/table-gl|local/journal|journal|local/journal)/' \
# fix monorepo package names (idempotent codemod)
codemod -m -d . --extensions json --accept-all \
'"name": "@/(resources|lib|components|features|local/server-data|local/components|local|local/hooks|local/table-gl|local/journal|journal|local/journal)/' \
'"name": "@\1/'
# rename static-assets to public (idempotent codemod)
codemod -m -d . --extensions ts,tsx,json,tpl,html --accept-all 'static-assets' 'public'
codemod -m -d ./apps/route-manager/.webpack --extensions ts,tsx,json,tpl,html --accept-all 'static-assets' 'public'
mv apps/route-manager/{static-assets,public}
# replace assets imports (idempotent codemod)
codemod -m -d ./local/server-data --extensions ts,tsx --accept-all 'import \* as(.*).(svg|png|jpg|jpeg|json)' 'import\1.\2'
codemod -m -d ./apps/route-manager --extensions ts,tsx --accept-all 'import \* as(.*).(svg|png|jpg|jpeg|json)' 'import\1.\2'
# replace locale imports (idempotent codemod)
codemod -m -d ./local/server-data --extensions ts --accept-all '../public/locales' '/locales'
codemod -m -d ./apps/route-manager --extensions ts --accept-all 'public/locales' '/locales'
# update some imports (idempotent codemod)
codemod -m -d . --extensions ts,tsx --accept-all 'import \* as tinycolor' 'import tinycolor'
codemod -m -d . --extensions ts,tsx --accept-all 'import \* as classnames' 'import classnames'
codemod -m -d ./apps/route-manager --extensions ts,tsx --accept-all 'import PIXI' 'import * as PIXI'
# NO NEED; ALREADY ON MASTER (by managing both the platforms) - update process.env variables (idempotent codemod)
# codemod -m -d . --extensions ts,tsx --accept-all \
# 'import.meta.env.VITE_\1'
# re-install dependencies
yarn deps
# commit everything
git add .
git commit -a -m "[AUTO] Migrated to Vite"
echo "--------------------\n--------------------"
echo "Codebase migrated to Vite \n\nNow you can run"
echo "- DEV $ yarn route-manager vite:start"
echo "- PROD $ yarn route-manager vite:build && cp apps/route-manager/{config.json,dist/config.json} && yarn route-manager vite:build:preview"
echo "--------------------\n--------------------"
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment