Resolve .babelrc files in a monorepo. (#4132)

* Resolve .babelrc files in a monorepo.

* Resolve .babelrc files in a monorepo.

* Add a unit test.

Co-authored-by: Jasper De Moor <[email protected]>

packages/core/integration-tests/test/babel.js

@@ -389,6 +389,23 @@ describe('babel', function() {
     assert(file.includes('hello there'));
   });
 
+  it('should support merging .babelrc and babel.config.json in a monorepo', async function() {
+    await bundle(
+      path.join(
+        __dirname,
+        '/integration/babel-config-monorepo/packages/pkg-a/src/index.js',
+      ),
+    );
+
+    let file = await outputFS.readFile(path.join(distDir, 'index.js'), 'utf8');
+    assert(!file.includes('REPLACE_ME'));
+    assert(file.includes('string from a plugin in babel.config.json'));
+    assert(!file.includes('ANOTHER_THING_TO_REPLACE'));
+    assert(file.includes('string from a plugin in .babelrc'));
+    assert(file.includes('SOMETHING ELSE'));
+    assert(!file.includes('string from a plugin from a different sub-package'));
+  });
+
   describe('tests needing the real filesystem', () => {
     beforeEach(async () => {
       await fs.rimraf(inputDir);

packages/core/integration-tests/test/integration/babel-config-monorepo/babel-plugin-dummy-1.js

@@ -0,0 +1,13 @@
+module.exports = () => {
+  return {
+    visitor: {
+      StringLiteral(path, state) {
+        const opts = state.opts;
+
+        if (path.node.value === 'REPLACE_ME') {
+          path.node.value = 'string from a plugin in babel.config.json';
+        }
+      }
+    }
+  };
+};

packages/core/integration-tests/test/integration/babel-config-monorepo/babel.config.json

@@ -0,0 +1,4 @@
+{
+    "plugins": ["./babel-plugin-dummy-1"]
+}
+

packages/core/integration-tests/test/integration/babel-config-monorepo/package.json

@@ -0,0 +1,5 @@
+{
+  "name": "monorepo-babel-config",
+  "private": true,
+  "workspaces": ["pkg-a", "pkg-b"]
+}

packages/core/integration-tests/test/integration/babel-config-monorepo/packages/pkg-a/.babelrc

@@ -0,0 +1,4 @@
+{
+    "plugins": ["./babel-plugin-dummy-2"]
+}
+

packages/core/integration-tests/test/integration/babel-config-monorepo/packages/pkg-a/babel-plugin-dummy-2.js

@@ -0,0 +1,13 @@
+module.exports = () => {
+  return {
+    visitor: {
+      StringLiteral(path, state) {
+        const opts = state.opts;
+
+        if (path.node.value === 'ANOTHER_THING_TO_REPLACE') {
+          path.node.value = 'string from a plugin in .babelrc';
+        }
+      }
+    }
+  };
+};

packages/core/integration-tests/test/integration/babel-config-monorepo/packages/pkg-a/package.json

@@ -0,0 +1,3 @@
+{
+  "name": "pkg-a"
+}

packages/core/integration-tests/test/integration/babel-config-monorepo/packages/pkg-a/src/index.js

@@ -0,0 +1,6 @@
+module.exports = function() {
+  const thing1 = "REPLACE_ME";
+  const thing2 = "ANOTHER_THING_TO_REPLACE"
+  const thing3 = "SOMETHING ELSE"
+  return thing1 + thing2 + thing3;
+}

packages/core/integration-tests/test/integration/babel-config-monorepo/packages/pkg-b/.babelrc

@@ -0,0 +1,4 @@
+{
+    "plugins": ["./babel-plugin-dummy-3"]
+}
+

packages/core/integration-tests/test/integration/babel-config-monorepo/packages/pkg-b/babel-plugin-dummy-3.js

@@ -0,0 +1,13 @@
+module.exports = () => {
+  return {
+    visitor: {
+      StringLiteral(path, state) {
+        const opts = state.opts;
+
+        if (path.node.value === 'ANOTHER_THING_TO_REPLACE') {
+          path.node.value = 'string from a plugin from a different sub-package';
+        }
+      }
+    }
+  };
+};

packages/core/integration-tests/test/integration/babel-config-monorepo/packages/pkg-b/package.json

@@ -0,0 +1,3 @@
+{
+  "name": "pkg-b"
+}

packages/core/integration-tests/test/integration/babel-config-monorepo/packages/pkg-b/src/index.js

@@ -0,0 +1,6 @@
+module.exports = function() {
+  const thing1 = "REPLACE_ME";
+  const thing2 = "ANOTHER_THING_TO_REPLACE"
+  const thing3 = "SOMETHING ELSE"
+  return thing1 + thing2 + thing3;
+}

packages/transformers/babel/src/config.js

@@ -7,7 +7,7 @@ import type {PluginLogger} from '@parcel/logger';
 import nullthrows from 'nullthrows';
 import path from 'path';
 import * as bundledBabelCore from '@babel/core';
-import {md5FromObject} from '@parcel/utils';
+import {md5FromObject, resolveConfig} from '@parcel/utils';
 
 import getEnvOptions from './env';
 import getJSXOptions from './jsx';
@@ -29,6 +29,20 @@ export async function load(
     return buildDefaultBabelConfig(config);
   }
 
+  // If we are in a monorepo, also find .babelrc configs in the sub packages.
+  let babelrcRoots = [options.projectRoot];
+  let packageJSONPath = await resolveConfig(
+    options.inputFS,
+    config.searchPath,
+    ['package.json'],
+  );
+  if (packageJSONPath) {
+    let packageRoot = path.dirname(packageJSONPath);
+    if (packageRoot && packageRoot !== options.projectRoot) {
+      babelrcRoots.push(packageRoot);
+    }
+  }
+
   let babelCore = await options.packageManager.require(
     '@babel/core',
     config.searchPath,
@@ -38,6 +52,7 @@ export async function load(
     filename: config.searchPath,
     cwd: path.dirname(config.searchPath),
     root: options.projectRoot,
+    babelrcRoots,
   });
 
   // loadPartialConfig returns null when the file should explicitly not be run through babel (ignore/exclude)