Add an option to enable/disable .babelrc lookup

Summary:
By default, when Babel transforms a file, it looks for .babelrc in the file's directory and all parent directories until it finds a .babelrc file. This means that when Metro tries to transform `<PROJECT_ROOT>/node_modules/dep/mod.js`, it searches for `<PROJECT_ROOT>/node_modules/dep/.babelrc`. If that .babelrc actually exists, Babel will try to apply it.

In practice, this often causes problems because packages that include .babelrc often do so unintentionally -- they don't intend for the package consumer to look at that .babelrc file. One thing we've done a lot is `rm` all .babelrc files under node_modules -- this commit effectively achieves the same in a less destructive way by telling Babel not to look up .babelrc files. (To clarify, Metro will still apply the .babelrc file in the project root.)

Since the current behavior is to look at .babelrc files, this commit keeps that behavior for now. We'll consider overriding the default behavior (that is, making Babel not lookup .babelrc files) in the default configuration of Expo/RN projects. If this goes well and we empirically find that people are having a better time, we may want to consider flipping this option's default in Metro, so that Metro tells Babel not to look up .babelrc files by default.
Closes https://github.com/facebook/metro-bundler/pull/31

Differential Revision: D5469620

Pulled By: jeanlauliac

fbshipit-source-id: fe7a1042feafff843e1a6d8cc9487eb6ff8e8358

packages/metro-bundler/src/Bundler/__tests__/Bundler-test.js

@@ -41,6 +41,7 @@ var commonOptions = {
   allowBundleUpdates: false,
   assetExts: defaults.assetExts,
   cacheVersion: 'smth',
+  enableBabelRCLookup: true,
   extraNodeModules: {},
   platforms: defaults.platforms,
   resetCache: false,
@@ -176,6 +177,7 @@ describe('Bundler', function() {
             minify: false,
             platform: undefined,
             transform: {
+              enableBabelRCLookup: true,
               dev: true,
               generateSourceMaps: false,
               hot: false,

packages/metro-bundler/src/Bundler/index.js

@@ -124,6 +124,7 @@ type Options = {|
   +assetServer: AssetServer,
   +blacklistRE?: RegExp,
   +cacheVersion: string,
+  +enableBabelRCLookup: boolean,
   +extraNodeModules: {},
   +getPolyfills: ({platform: ?string}) => $ReadOnlyArray<string>,
   +getTransformOptions?: GetTransformOptions,
@@ -545,6 +546,7 @@ class Bundler {
     return this.getTransformOptions(
       entryFile,
       {
+        enableBabelRCLookup: this._opts.enableBabelRCLookup,
         dev,
         generateSourceMaps,
         hot,
@@ -587,6 +589,7 @@ class Bundler {
     const bundlingOptions: BundlingOptions = await this.getTransformOptions(
       entryFile,
       {
+        enableBabelRCLookup: this._opts.enableBabelRCLookup,
         dev,
         platform,
         hot,
@@ -797,6 +800,7 @@ class Bundler {
   async getTransformOptions(
     mainModuleName: string,
     options: {|
+      enableBabelRCLookup: boolean,
       dev: boolean,
       generateSourceMaps: boolean,
       hot: boolean,
@@ -822,6 +826,7 @@ class Bundler {
         minify: options.minify,
         platform,
         transform: {
+          enableBabelRCLookup: options.enableBabelRCLookup,
           dev,
           generateSourceMaps: options.generateSourceMaps,
           hot,

packages/metro-bundler/src/JSTransformer/worker/index.js

@@ -43,6 +43,7 @@ export type Transformer<ExtraOptions: {} = {}> = {
 };
 
 export type TransformOptionsStrict = {|
+  +enableBabelRCLookup: boolean,
   +dev: boolean,
   +generateSourceMaps: boolean,
   +hot: boolean,
@@ -52,6 +53,7 @@ export type TransformOptionsStrict = {|
 |};
 
 export type TransformOptions = {
+  +enableBabelRCLookup?: boolean,
   +dev?: boolean,
   +generateSourceMaps?: boolean,
   +hot?: boolean,

packages/metro-bundler/src/Server/index.js

@@ -70,6 +70,7 @@ type Options = {
   assetExts?: Array<string>,
   blacklistRE?: RegExp,
   cacheVersion?: string,
+  enableBabelRCLookup?: boolean,
   extraNodeModules?: {},
   getPolyfills: ({platform: ?string}) => $ReadOnlyArray<string>,
   getTransformOptions?: GetTransformOptions,
@@ -131,6 +132,7 @@ class Server {
     assetExts: Array<string>,
     blacklistRE: void | RegExp,
     cacheVersion: string,
+    enableBabelRCLookup: boolean,
     extraNodeModules: {},
     getPolyfills: ({platform: ?string}) => $ReadOnlyArray<string>,
     getTransformOptions?: GetTransformOptions,
@@ -176,6 +178,10 @@ class Server {
       assetExts: options.assetExts || defaults.assetExts,
       blacklistRE: options.blacklistRE,
       cacheVersion: options.cacheVersion || '1.0',
+      enableBabelRCLookup:
+        options.enableBabelRCLookup != null
+          ? options.enableBabelRCLookup
+          : true,
       extraNodeModules: options.extraNodeModules || {},
       getPolyfills: options.getPolyfills,
       getTransformOptions: options.getTransformOptions,

packages/metro-bundler/src/index.js

@@ -36,6 +36,7 @@ type Options = {|
   +sourceExts: ?Array<string>,
   +transformCache: TransformCache,
   +transformModulePath: string,
+  enableBabelRCLookup?: boolean,
   getPolyfills: ({platform: ?string}) => $ReadOnlyArray<string>,
   globalTransformCache: ?GlobalTransformCache,
   hasteImpl?: HasteImpl,

packages/metro-bundler/src/transformer.js

@@ -87,6 +87,9 @@ function buildBabelConfig(filename, options) {
   const babelRC = getBabelRC(options.projectRoot);
 
   const extraConfig = {
+    babelrc: typeof options.enableBabelRCLookup === 'boolean'
+      ? options.enableBabelRCLookup
+      : true,
     code: false,
     filename,
   };