Make minifier options configurable

Reviewed By: davidaurelio

Differential Revision: D10147357

fbshipit-source-id: 3bc836e22e9dbb13a9ad4e993b6e36e659f95445

Author: rafeca

docs/Configuration.md

@@ -71,6 +71,7 @@ These options are used when Metro serves the content.
 | `getTransformOptions`    | `GetTransformOptions`                   | Get the transform options.                                                             |
 | `postMinifyProcess`      | `PostMinifyProcess`                     | What happens after minification.                                                       |
 | `minifierPath`           | `string`                                | Path to the minifier that minifies the code after transformation.                      |
+| `minifierConfig`         | `{[key: string]: mixed}`                | Configuration object that will be passed to the minifier (it should be serializable).  |
 | `optimizationSizeLimit`  | `number`                                | Define a threshold (in bytes) to disable some expensive optimizations for big files.   |
 
 #### React Native Only

packages/metro-config/src/__tests__/__snapshots__/loadConfig-test.js.snap

@@ -87,6 +87,23 @@ Object {
     "enableBabelRCLookup": true,
     "enableBabelRuntime": true,
     "getTransformOptions": [Function],
+    "minifierConfig": Object {
+      "compress": Object {
+        "reduce_funcs": false,
+      },
+      "mangle": Object {
+        "toplevel": false,
+      },
+      "output": Object {
+        "ascii_only": true,
+        "quote_style": 3,
+        "wrap_iife": true,
+      },
+      "sourceMap": Object {
+        "includeSources": false,
+      },
+      "toplevel": false,
+    },
     "minifierPath": "metro-minify-uglify",
     "optimizationSizeLimit": 153600,
     "postMinifyProcess": [Function],
@@ -189,6 +206,23 @@ Object {
     "enableBabelRCLookup": true,
     "enableBabelRuntime": true,
     "getTransformOptions": [Function],
+    "minifierConfig": Object {
+      "compress": Object {
+        "reduce_funcs": false,
+      },
+      "mangle": Object {
+        "toplevel": false,
+      },
+      "output": Object {
+        "ascii_only": true,
+        "quote_style": 3,
+        "wrap_iife": true,
+      },
+      "sourceMap": Object {
+        "includeSources": false,
+      },
+      "toplevel": false,
+    },
     "minifierPath": "metro-minify-uglify",
     "optimizationSizeLimit": 153600,
     "postMinifyProcess": [Function],

packages/metro-config/src/convertConfig.js

@@ -137,6 +137,7 @@ async function convertOldToNew({
       enableBabelRCLookup: getEnableBabelRCLookup(),
       enableBabelRuntime: true,
       getTransformOptions,
+      minifierConfig: defaultConfig.transformer.minifierConfig,
       minifierPath: minifierPath || defaultConfig.transformer.minifierPath,
       optimizationSizeLimit: 150 * 1024, // 150 KiB enforced for old configs.
       postMinifyProcess,

packages/metro-config/src/defaults/index.js

@@ -75,6 +75,24 @@ const getDefaultValues = (projectRoot: ?string): ConfigT => ({
       preloadedModules: false,
       ramGroups: [],
     }),
+    minifierConfig: {
+      mangle: {
+        toplevel: false,
+      },
+      output: {
+        ascii_only: true,
+        quote_style: 3,
+        wrap_iife: true,
+      },
+      sourceMap: {
+        includeSources: false,
+      },
+      toplevel: false,
+      compress: {
+        // reduce_funcs inlines single-use functions, which cause perf regressions.
+        reduce_funcs: false,
+      },
+    },
     minifierPath: DEFAULT_METRO_MINIFIER_PATH,
     optimizationSizeLimit: 150 * 1024, // 150 KiB.
     postMinifyProcess: x => x,

packages/metro-minify-terser/__tests__/minify-test.js

@@ -38,6 +38,7 @@ const baseOptions = {
   map: getFakeMap(),
   filename: '',
   reserved: [],
+  config: {},
 };
 
 describe('Minification:', () => {
@@ -59,6 +60,7 @@ describe('Minification:', () => {
       code,
       map,
       filename,
+      config: {sourceMap: {includeSources: false}},
     });
     expect(terser.minify).toBeCalledWith(
       code,

packages/metro-minify-terser/src/minifier.js

@@ -35,34 +35,32 @@ function minify({
   code,
   map,
   reserved,
+  config,
 }: MinifierOptions): {code: string, map: ?string} {
-  const result = terser.minify(code, {
+  const options = {
+    ...config,
     mangle: {
-      toplevel: false,
+      ...config.mangle,
       reserved,
     },
-    output: {
-      ascii_only: true,
-      quote_style: 3,
-      wrap_iife: true,
-    },
-    sourceMap: {
-      content: map,
-      includeSources: false,
-    },
-    toplevel: false,
-    compress: {
-      // reduce_funcs inlines single-use function, which cause perf regressions.
-      reduce_funcs: false,
-    },
-  });
+    sourceMap: map
+      ? {
+          ...config.sourceMap,
+          content: map,
+        }
+      : false,
+  };
+
+  const result = terser.minify(code, options);
 
   if (result.error) {
     throw result.error;
   }
 
   return {
     code: result.code,
+    // eslint-disable-next-line lint/flow-no-fixme
+    // $FlowFixMe flow cannot coerce the uglify options after using spread.
     map: result.map,
   };
 }

packages/metro-minify-uglify/__tests__/minify-test.js

@@ -38,6 +38,7 @@ const baseOptions = {
   map: getFakeMap(),
   filename: '',
   reserved: [],
+  config: {},
 };
 
 describe('Minification:', () => {
@@ -59,6 +60,7 @@ describe('Minification:', () => {
       code,
       map,
       filename,
+      config: {sourceMap: {includeSources: false}},
     });
     expect(uglify.minify).toBeCalledWith(
       code,

packages/metro-minify-uglify/src/minifier.js

@@ -35,34 +35,30 @@ function minify({
   code,
   map,
   reserved,
+  config,
 }: MinifierOptions): {code: string, map: ?string} {
-  const result = uglify.minify(code, {
+  const options = {
+    ...config,
     mangle: {
-      toplevel: false,
+      ...config.mangle,
       reserved,
     },
-    output: {
-      ascii_only: true,
-      quote_style: 3,
-      wrap_iife: true,
-    },
     sourceMap: {
+      ...config.sourceMap,
       content: map,
-      includeSources: false,
-    },
-    toplevel: false,
-    compress: {
-      // reduce_funcs inlines single-use function, which cause perf regressions.
-      reduce_funcs: false,
     },
-  });
+  };
+
+  const result = uglify.minify(code, options);
 
   if (result.error) {
     throw result.error;
   }
 
   return {
     code: result.code,
+    // eslint-disable-next-line lint/flow-no-fixme
+    // $FlowFixMe flow cannot coerce the uglify options after using spread.
     map: result.map,
   };
 }

packages/metro/src/JSTransformer/worker.js

@@ -69,11 +69,14 @@ export type BabelTransformer = {|
   getCacheKey?: () => string,
 |};
 
+type MinifierConfig = $ReadOnly<{[string]: mixed}>;
+
 export type MinifierOptions = {
   code: string,
   map: ?BabelSourceMap,
   filename: string,
   reserved: $ReadOnlyArray<string>,
+  config: MinifierConfig,
 };
 
 export type Type = 'script' | 'module' | 'asset';
@@ -86,6 +89,7 @@ export type JsTransformerConfig = $ReadOnly<{|
   dynamicDepsInPackages: DynamicRequiresBehavior,
   enableBabelRCLookup: boolean,
   enableBabelRuntime: boolean,
+  minifierConfig: MinifierConfig,
   minifierPath: string,
   optimizationSizeLimit: number,
 |}>;
@@ -345,6 +349,7 @@ class JsTransformer {
         map: sourceMap,
         filename,
         reserved,
+        config: this._config.minifierConfig,
       });
 
       return {

packages/metro/src/JSTransformer/worker/__tests__/worker-test.js

@@ -42,6 +42,7 @@ const baseOptions = {
   babelTransformerPath,
   dynamicDepsInPackages: 'reject',
   enableBabelRuntime: true,
+  minifierConfig: {},
   minifierPath: 'minifyModulePath',
   optimizationSizeLimit: 100000,
 };