Page MenuHomePhabricator

[RN72][skip-ci] Update Babel config for monorepo setup
ClosedPublic

Authored by ashoat on Jan 4 2024, 12:19 PM.
Tags
None
Referenced Files
Unknown Object (File)
Sat, Nov 23, 8:47 AM
Unknown Object (File)
Oct 31 2024, 5:22 AM
Unknown Object (File)
Oct 3 2024, 1:24 PM
Unknown Object (File)
Oct 3 2024, 1:24 PM
Unknown Object (File)
Oct 3 2024, 1:24 PM
Unknown Object (File)
Oct 3 2024, 1:24 PM
Unknown Object (File)
Oct 3 2024, 1:24 PM
Unknown Object (File)
Oct 3 2024, 1:24 PM
Subscribers

Details

Summary

In the next diff, we update ESLint, which necessitates replacing the deprecated babel-eslint with the new @babel/eslint-parser.

The new @babel/eslint-parser appears to break yarn eslint:fix from the repo root, since it can't find a Babel config file.

To address this, I had to update our Babel config to work from the root. Some relevant docs I had to read:

In short, Babel's docs recommend that for a monorepo setup, you use a single babel.config.cjs file in the root, and then specify .babelrc.cjs files for individual workspaces. However, this didn't work with Jest, which was ignoring the .babelrc.cjs files. This is documented in issues on the Jest repo, but there are no official solutions. To get around this, I ended up also specifying babel.config.cjs files for the individual workspaces, that simply reference the .babelrc.cjs files.

Depends on D10536

Test Plan

In combination with the next diff, run yarn eslint:fix from the repo root

Diff Detail

Repository
rCOMM Comm
Lint
No Lint Coverage
Unit
No Test Coverage

Event Timeline

babel.config.cjs
1

The new @babel/eslint-parser fails without a Babel config in the root when you're running ESLint from the root, so I had to specify a root babel.config.js. I chose to just move the lib one to the root, as it's basically the "least common denominator" of ESLint configs in our repo

24

The reason we need this is explained here:

  • Searching will stop once a directory containing a package.json is found, so a relative config only applies within a single package.
  • The "filename" being compiled must be inside of "babelrcRoots" packages, or else searching will be skipped entirely.

These caveats mean that:

  • .babelrc.json files only apply to files within their own package
  • .babelrc.json files in packages that aren't Babel's 'root' are ignored unless you opt in with "babelrcRoots".
desktop/.babelrc.cjs
1

Babel does not recommend a setup with multiple babel.config.cjs files. Instead, in a monorepo you're supposed to have one babel.config.cjs file at the root, and then one .babelrc.cjs file for each package where you want to override something.

As such, I moved these per-package babel.config.cjs files to .babelrc.cjs.

keyserver/babel.config.cjs
2

Notwithstanding the previous inline comment... for reasons explained in the last paragraph of the diff description, I needed to keep the babel.config.cjs files to keep Jest working. To avoid duplicating anything, I simply reference the .babelrc.cjs files from the babel.config.cjs files.

keyserver/package.json
10–11

I'm hoping eventually Jest will figure out how to use Babel's config correctly, at which point we can delete the per-workspace babel.config.cjs files. For that reason, I've updated these commands to reference the correct .babelrc.cjs files instead of the just-there-for-Jest babel.config.cjs files

105

This change is necessary for Jest to be able to find the root babel.config.cjs. I got from the "Jest" section of this blog post.

Curiously, I found this change necessary even after I created the babel.config.cjs alias files.

Update Webpack configs to look at .babelrc.cjs instead of babel.config.cjs. This was breaking landing because I didn't include an alias babel.config.cjs file there (since we don't have any Jest tests in landing)

Udpate keyserver/Dockerfile to copy keyserver/.babelrc.cjs instead of keyserver/babel.config.cjs

This revision is now accepted and ready to land.Jan 4 2024, 2:27 PM