ref(build): Centralize identical CDN rollup config (#4637)

There is a great deal of overlap between the rollup config files we use to generate our CDN bundles. As part of moving to the new bundling process, this pulls the most obvious pieces of shared config into a central file. (In this case, “most obvious” means that they are strictly identical across files, with no tweaks needed. A follow-up PR will handle the places where there are slight differences between one rollup config and another.)

As one would hope when moving things without changing them, there is no effect on the content of the bundles produced.

Author: lobsterkatie

packages/browser/rollup.config.js

@@ -1,12 +1,16 @@
 import { terser } from 'rollup-plugin-terser';
 import typescript from 'rollup-plugin-typescript2';
-import license from 'rollup-plugin-license';
-import resolve from '@rollup/plugin-node-resolve';
-import replace from '@rollup/plugin-replace';
 
-const commitHash = require('child_process')
-  .execSync('git rev-parse --short HEAD', { encoding: 'utf-8' })
-  .trim();
+import {
+  baseBundleConfig,
+  makeLicensePlugin,
+  markAsBrowserBuild,
+  nodeResolvePlugin,
+  paths,
+  typescriptPluginES5,
+} from '../../rollup.config';
+
+const licensePlugin = makeLicensePlugin();
 
 const terserInstance = terser({
   compress: {
@@ -37,60 +41,23 @@ const terserInstance = terser({
   },
 });
 
-const paths = {
-  '@sentry/utils': ['../utils/src'],
-  '@sentry/core': ['../core/src'],
-  '@sentry/hub': ['../hub/src'],
-  '@sentry/types': ['../types/src'],
-  '@sentry/minimal': ['../minimal/src'],
-};
-
 const plugins = [
-  typescript({
-    tsconfig: 'tsconfig.esm.json',
-    tsconfigOverride: {
-      compilerOptions: {
-        declaration: false,
-        declarationMap: false,
-        paths,
-        baseUrl: '.',
-      },
-    },
-    include: ['*.ts+(|x)', '**/*.ts+(|x)', '../**/*.ts+(|x)'],
-  }),
-  replace({
-    // don't replace `__placeholder__` where it's followed immediately by a single `=` (to prevent ending up
-    // with something of the form `let "replacementValue" = "some assigned value"`, which would cause a
-    // syntax error)
-    preventAssignment: true,
-    // the replacements to make
-    values: {
-      __SENTRY_BROWSER_BUNDLE__: true,
-    },
-  }),
-  resolve({
-    mainFields: ['module'],
-  }),
+  typescriptPluginES5,
+  // replace `__SENTRY_BROWSER_BUNDLE__` with `true` to enable treeshaking of non-browser code
+  markAsBrowserBuild,
+  nodeResolvePlugin,
 ];
 
 const bundleConfig = {
+  ...baseBundleConfig,
   input: 'src/index.ts',
   output: {
+    ...baseBundleConfig.output,
     format: 'iife',
     name: 'Sentry',
-    sourcemap: true,
-    strict: false,
-    esModule: false,
   },
   context: 'window',
-  plugins: [
-    ...plugins,
-    license({
-      sourcemap: true,
-      banner: `/*! @sentry/browser <%= pkg.version %> (${commitHash}) | https://github.com/getsentry/sentry-javascript */`,
-    }),
-  ],
-  treeshake: 'smallest',
+  plugins: [...plugins, licensePlugin],
 };
 
 export default [
@@ -109,10 +76,7 @@ export default [
       file: 'build/bundle.min.js',
     },
     // Uglify has to be at the end of compilation, BUT before the license banner
-    plugins: bundleConfig.plugins
-      .slice(0, -1)
-      .concat(terserInstance)
-      .concat(bundleConfig.plugins.slice(-1)),
+    plugins: bundleConfig.plugins.slice(0, -1).concat(terserInstance).concat(bundleConfig.plugins.slice(-1)),
   },
   // ------------------
   // ES6 Browser Bundle
@@ -159,11 +123,7 @@ export default [
         },
         include: ['*.ts+(|x)', '**/*.ts+(|x)', '../**/*.ts+(|x)'],
       }),
-      ...plugins
-        .slice(1)
-        .slice(0, -1)
-        .concat(terserInstance)
-        .concat(bundleConfig.plugins.slice(-1)),
+      ...plugins.slice(1).slice(0, -1).concat(terserInstance).concat(bundleConfig.plugins.slice(-1)),
     ],
   },
   // ------------------

packages/integrations/rollup.config.js

@@ -1,10 +1,15 @@
 import * as fs from 'fs';
 
 import { terser } from 'rollup-plugin-terser';
-import typescript from 'rollup-plugin-typescript2';
-import resolve from '@rollup/plugin-node-resolve';
 import commonjs from '@rollup/plugin-commonjs';
-import replace from '@rollup/plugin-replace';
+
+import {
+  addOnBundleConfig,
+  baseBundleConfig,
+  markAsBrowserBuild,
+  nodeResolvePlugin,
+  typescriptPluginES5,
+} from '../../rollup.config';
 
 const terserInstance = terser({
   mangle: {
@@ -21,52 +26,13 @@ const terserInstance = terser({
 });
 
 const plugins = [
-  typescript({
-    tsconfig: 'tsconfig.esm.json',
-    tsconfigOverride: {
-      compilerOptions: {
-        declaration: false,
-        declarationMap: false,
-        paths: {
-          '@sentry/utils': ['../utils/src'],
-          '@sentry/core': ['../core/src'],
-          '@sentry/hub': ['../hub/src'],
-          '@sentry/types': ['../types/src'],
-          '@sentry/minimal': ['../minimal/src'],
-        },
-        baseUrl: '.',
-      },
-    },
-    include: ['*.ts+(|x)', '**/*.ts+(|x)', '../**/*.ts+(|x)'],
-  }),
-  replace({
-    // don't replace `__placeholder__` where it's followed immediately by a single `=` (to prevent ending up
-    // with something of the form `let "replacementValue" = "some assigned value"`, which would cause a
-    // syntax error)
-    preventAssignment: true,
-    // the replacements to make
-    values: {
-      __SENTRY_BROWSER_BUNDLE__: true,
-    },
-  }),
-  resolve({
-    mainFields: ['module'],
-  }),
+  typescriptPluginES5,
+  // replace `__SENTRY_BROWSER_BUNDLE__` with `true` to enable treeshaking of non-browser code
+  markAsBrowserBuild,
+  nodeResolvePlugin,
   commonjs(),
 ];
 
-function mergeIntoSentry() {
-  return `
-  __window.Sentry = __window.Sentry || {};
-  __window.Sentry.Integrations = __window.Sentry.Integrations || {};
-  for (var key in exports) {
-    if (Object.prototype.hasOwnProperty.call(exports, key)) {
-      __window.Sentry.Integrations[key] = exports[key];
-    }
-  }
-  `;
-}
-
 function allIntegrations() {
   return fs.readdirSync('./src').filter(file => file != 'index.ts');
 }
@@ -85,20 +51,14 @@ function loadAllIntegrations() {
   ].forEach(build => {
     builds.push(
       ...allIntegrations().map(file => ({
+        ...baseBundleConfig,
         input: `src/${file}`,
         output: {
-          banner: '(function (__window) {',
-          intro: 'var exports = {};',
-          outro: mergeIntoSentry(),
-          footer: '}(window));',
+          ...baseBundleConfig.output,
+          ...addOnBundleConfig.output,
           file: `build/${file.replace('.ts', build.extension)}`,
-          format: 'cjs',
-          sourcemap: true,
-          strict: false,
-          esModule: false,
         },
         plugins: build.plugins,
-        treeshake: 'smallest',
       })),
     );
   });

packages/tracing/rollup.config.js

@@ -1,84 +1,32 @@
-import { terser } from 'rollup-plugin-terser';
-import typescript from 'rollup-plugin-typescript2';
-import license from 'rollup-plugin-license';
-import resolve from '@rollup/plugin-node-resolve';
-import replace from '@rollup/plugin-replace';
+import {
+  baseBundleConfig,
+  makeLicensePlugin,
+  markAsBrowserBuild,
+  nodeResolvePlugin,
+  terserPlugin,
+  typescriptPluginES5,
+} from '../../rollup.config';
 
-const commitHash = require('child_process')
-  .execSync('git rev-parse --short HEAD', { encoding: 'utf-8' })
-  .trim();
-
-const terserInstance = terser({
-  mangle: {
-    // captureExceptions and captureMessage are public API methods and they don't need to be listed here
-    // as mangler doesn't touch user-facing thing, however sentryWrapped is not, and it would be mangled into a minified version.
-    // We need those full names to correctly detect our internal frames for stripping.
-    // I listed all of them here just for the clarity sake, as they are all used in the frames manipulation process.
-    reserved: ['captureException', 'captureMessage', 'sentryWrapped'],
-    properties: {
-      regex: /^_[^_]/,
-    },
-  },
-  output: {
-    comments: false,
-  },
-});
-
-const paths = {
-  '@sentry/utils': ['../utils/src'],
-  '@sentry/core': ['../core/src'],
-  '@sentry/hub': ['../hub/src'],
-  '@sentry/types': ['../types/src'],
-  '@sentry/minimal': ['../minimal/src'],
-  '@sentry/browser': ['../browser/src'],
-};
+const licensePlugin = makeLicensePlugin('@sentry/tracing & @sentry/browser');
 
 const plugins = [
-  typescript({
-    tsconfig: 'tsconfig.esm.json',
-    tsconfigOverride: {
-      compilerOptions: {
-        declaration: false,
-        declarationMap: false,
-        paths,
-        baseUrl: '.',
-      },
-    },
-    include: ['*.ts+(|x)', '**/*.ts+(|x)', '../**/*.ts+(|x)'],
-  }),
-  replace({
-    // don't replace `__placeholder__` where it's followed immediately by a single `=` (to prevent ending up
-    // with something of the form `let "replacementValue" = "some assigned value"`, which would cause a
-    // syntax error)
-    preventAssignment: true,
-    // the replacements to make
-    values: {
-      __SENTRY_BROWSER_BUNDLE__: true,
-    },
-  }),
-  resolve({
-    mainFields: ['module'],
-  }),
+  typescriptPluginES5,
+  // replace `__SENTRY_BROWSER_BUNDLE__` with `true` to enable treeshaking of non-browser code
+  markAsBrowserBuild,
+  nodeResolvePlugin,
+  licensePlugin,
 ];
 
 const bundleConfig = {
+  ...baseBundleConfig,
   input: 'src/index.ts',
   output: {
+    ...baseBundleConfig.output,
     format: 'iife',
     name: 'Sentry',
-    sourcemap: true,
-    strict: false,
-    esModule: false,
   },
   context: 'window',
-  plugins: [
-    ...plugins,
-    license({
-      sourcemap: true,
-      banner: `/*! @sentry/tracing & @sentry/browser <%= pkg.version %> (${commitHash}) | https://github.com/getsentry/sentry-javascript */`,
-    }),
-  ],
-  treeshake: 'smallest',
+  plugins,
 };
 
 export default [
@@ -100,9 +48,6 @@ export default [
       file: 'build/bundle.tracing.min.js',
     },
     // Uglify has to be at the end of compilation, BUT before the license banner
-    plugins: bundleConfig.plugins
-      .slice(0, -1)
-      .concat(terserInstance)
-      .concat(bundleConfig.plugins.slice(-1)),
+    plugins: bundleConfig.plugins.slice(0, -1).concat(terserPlugin).concat(bundleConfig.plugins.slice(-1)),
   },
 ];