Remove Babel from the build; let Vite transform everything natively - #157
Merged
Conversation
Babel was doing two remaining jobs: transforming JSX in .js files
(which vite's native transform won't parse) and running
babel-plugin-transform-goober, which rewrote styled.div`...` to
styled("div")`...` because goober has no runtime support for the
property-access form. Both are eliminated at the source:
- the 32 files containing JSX are renamed to .jsx, which vite
transforms natively with the automatic runtime. All imports were
already extensionless, so no import statements change.
- the 21 styled.tag usages across the options demo components are
rewritten to explicit styled("tag") calls, matching goober's
documented API instead of relying on a build-time rewrite.
That leaves nothing for Babel to do, so babel-jsx.mjs and the
@babel/core, @babel/plugin-transform-react-jsx, and
babel-plugin-transform-goober dev deps are removed. This also drops the
last Babel 7 pin (the goober plugin never supported Babel 8) and the
rolldown INVALID_ANNOTATION warnings caused by the plugin's misplaced
pure annotations.
Verified: production build is clean, the popup pre-render produces
byte-identical markup to the checked-in src/popup.html, all 70 unit
tests pass, and the extension smoke tests (popup search/virtualized
scrolling, options pages including the styled demos) run with no
console or hydration errors.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_017DTY8KLAPgLRcooVuTUMKi
The Test workflow previously only ran on pushes to the long-lived branches, so PRs merged without CI ever seeing them. The pull_request trigger runs the same job against the PR's merge preview. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_017DTY8KLAPgLRcooVuTUMKi
fwextensions
force-pushed
the
claude/debabel-wjrm30
branch
from
July 19, 2026 02:21
2bae903 to
39c53c9
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Babel had two remaining jobs after the Vite migration, and this removes both at the source so Vite's native transform handles all packaging:
.jsfiles → the 32 files containing JSX are renamed to.jsx(puregit mv, 100% similarity on all but the demo files). Every import in the codebase was already extensionless, so no import statements change — Vite resolves.jsxautomatically.babel-plugin-transform-goober→ the 21styled.tagusages in the options demo components are rewritten to explicitstyled("tag")calls. This was the semantically-required transform: goober has no runtime support for the property-access form, so the source only worked because of the build-time rewrite. Now the code matches goober's documented API directly.With nothing left for Babel to do,
build/scripts/babel-jsx.mjsis deleted and the@babel/core,@babel/plugin-transform-react-jsx, andbabel-plugin-transform-gooberdev deps are removed.Side benefits:
INVALID_ANNOTATIONwarnings, which came from the goober plugin's misplaced/*#__PURE__*/annotationsNet diff: +34 / −561 (mostly the deleted plugin and lockfile pruning).
Verification
src/popup.html(Vite's automatic-runtime JSX output matches what Babel produced)Note
git log --followtracks the renames; blame gains one hop on the 32 renamed files.🤖 Generated with Claude Code
https://claude.ai/code/session_017DTY8KLAPgLRcooVuTUMKi
Generated by Claude Code