add function for merging plugin arrays

Author: lobsterkatie

rollup/bundleHelpers.js

@@ -2,8 +2,6 @@
  * Rollup config docs: https://rollupjs.org/guide/en/#big-list-of-options
  */
 
-import assert from 'assert';
-
 import deepMerge from 'deepmerge';
 
 import {
@@ -17,7 +15,7 @@ import {
   makeTerserPlugin,
   makeTSPlugin,
 } from './plugins/index.js';
-import { getLastElement, insertAt } from './utils.js';
+import { mergePlugins } from './utils';
 
 export function makeBaseBundleConfig(options) {
   const { input, isAddOn, jsVersion, licenseTitle, outputFileBase } = options;
@@ -95,7 +93,10 @@ export function makeBaseBundleConfig(options) {
     treeshake: 'smallest',
   };
 
-  return deepMerge(sharedBundleConfig, isAddOn ? addOnBundleConfig : standAloneBundleConfig);
+  return deepMerge(sharedBundleConfig, isAddOn ? addOnBundleConfig : standAloneBundleConfig, {
+    // Plugins have to be in the correct order or everything breaks, so when merging we have to manually re-order them
+    customMerge: key => (key === 'plugins' ? mergePlugins : undefined),
+  });
 }
 
 /**
@@ -108,52 +109,45 @@ export function makeBaseBundleConfig(options) {
  * @returns An array of versions of that config
  */
 export function makeBundleConfigVariants(baseConfig) {
-  const { plugins: baseConfigPlugins } = baseConfig;
   const includeDebuggingPlugin = makeIsDebugBuildPlugin(true);
   const stripDebuggingPlugin = makeIsDebugBuildPlugin(false);
   const terserPlugin = makeTerserPlugin();
 
-  // The license plugin has to be last, so it ends up after terser. Otherwise, terser will remove the license banner.
-  assert(
-    getLastElement(baseConfigPlugins).name === 'rollup-plugin-license',
-    `Last plugin in given options should be \`rollup-plugin-license\`. Found ${getLastElement(baseConfigPlugins).name}`,
-  );
-
   // The additional options to use for each variant we're going to create
   const variantSpecificConfigs = [
     {
       output: {
         file: `${baseConfig.output.file}.js`,
       },
-      plugins: insertAt(baseConfigPlugins, -2, includeDebuggingPlugin),
+      plugins: [includeDebuggingPlugin],
     },
     // This variant isn't particularly helpful for an SDK user, as it strips logging while making no other minification
     // changes, so by default we don't create it. It is however very useful when debugging rollup's treeshaking, so it's
     // left here for that purpose.
     // {
     //   output: { file: `${baseConfig.output.file}.no-debug.js`,
     //   },
-    //   plugins: insertAt(plugins, -2, stripDebuggingPlugin),
+    //   plugins: [stripDebuggingPlugin],
     // },
     {
       output: {
         file: `${baseConfig.output.file}.min.js`,
       },
-      plugins: insertAt(baseConfigPlugins, -2, stripDebuggingPlugin, terserPlugin),
+      plugins: [stripDebuggingPlugin, terserPlugin],
     },
     {
       output: {
         file: `${baseConfig.output.file}.debug.min.js`,
       },
-      plugins: insertAt(baseConfigPlugins, -2, includeDebuggingPlugin, terserPlugin),
+      plugins: [terserPlugin],
     },
   ];
 
   return variantSpecificConfigs.map(variant =>
     deepMerge(baseConfig, variant, {
-      // this makes it so that instead of concatenating the `plugin` properties of the two objects, the first value is
-      // just overwritten by the second value
-      arrayMerge: (first, second) => second,
+      // Merge the plugin arrays and make sure the end result is in the correct order. Everything else can use the
+      // default merge strategy.
+      customMerge: key => (key === 'plugins' ? mergePlugins : undefined),
     }),
   );
 }

rollup/utils.js

@@ -1,11 +1,6 @@
 /**
- * Helper functions to compensate for the fact that JS can't handle negative array indices very well
+ * Helper function to compensate for the fact that JS can't handle negative array indices very well
  */
-
-export const getLastElement = array => {
-  return array[array.length - 1];
-};
-
 export const insertAt = (arr, index, ...insertees) => {
   const newArr = [...arr];
   // Add 1 to the array length so that the inserted element ends up in the right spot with respect to the length of the
@@ -14,3 +9,22 @@ export const insertAt = (arr, index, ...insertees) => {
   newArr.splice(destinationIndex, 0, ...insertees);
   return newArr;
 };
+
+/**
+ * Merge two arrays of plugins, making sure they're sorted in the correct order.
+ */
+export function mergePlugins(pluginsA, pluginsB) {
+  const plugins = [...pluginsA, ...pluginsB];
+  plugins.sort((a, b) => {
+    // Hacky way to make sure the ones we care about end up where they belong in the order. (Really the TS and sucrase
+    // plugins are tied - both should come first - but they're mutually exclusive, so they can come in arbitrary order
+    // here.)
+    const order = ['typescript', 'sucrase', '...', 'terser', 'license'];
+    const sortKeyA = order.includes(a.name) ? a.name : '...';
+    const sortKeyB = order.includes(b.name) ? b.name : '...';
+
+    return order.indexOf(sortKeyA) - order.indexOf(sortKeyB);
+  });
+
+  return plugins;
+}