fix #2230 - prevent babel helpers duplication and condense bundle & types

package.json

@@ -43,6 +43,7 @@
     "@babel/plugin-transform-react-jsx": "7.23.4",
     "@babel/preset-env": "7.23.5",
     "@babel/preset-typescript": "7.23.3",
+    "@rollup/plugin-babel": "^6.0.4",
     "@rollup/plugin-json": "4.1.0",
     "@rollup/plugin-node-resolve": "7.1.1",
     "@rollup/plugin-replace": "2.3.3",
@@ -62,8 +63,6 @@
     "babel-plugin-inline-replace-variables": "1.3.1",
     "babel-plugin-module-resolver": "4.0.0",
     "bundlesize2": "0.0.31",
-    "concurrently": "5.3.0",
-    "cross-env": "7.0.3",
     "cssnano": "4.1.10",
     "cypress": "9.6.1",
     "dotenv": "16.3.1",
@@ -88,8 +87,8 @@
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "rollup": "1.32.1",
-    "rollup-plugin-babel": "4.4.0",
     "rollup-plugin-commonjs": "10.1.0",
+    "rollup-plugin-dts": "^6.1.1",
     "rollup-plugin-filesize": "9.1.2",
     "rollup-plugin-license": "3.2.0",
     "rollup-plugin-terser": "7.0.2",

packages/docsearch-js/package.json

@@ -22,11 +22,10 @@
   "jsdelivr": "dist/umd/index.js",
   "scripts": {
     "build:clean": "rm -rf ./dist",
-    "build:esm": "cross-env BUILD=esm rollup --config",
-    "build:types": "tsc -p ./tsconfig.declaration.json --outDir ./dist/esm",
-    "build:umd": "cross-env BUILD=umd rollup --config",
-    "build": "yarn build:clean && yarn build:umd && yarn build:esm && yarn build:types",
-    "on:change": "concurrently \"yarn build:esm\" \"yarn build:types\"",
+    "build:types": "tsc -p ./tsconfig.declaration.json --outDir ./dist/esm/types",
+    "build:clean-types": "rm -rf ./dist/esm/types",
+    "build": "yarn build:clean && yarn build:types && rollup --config && yarn build:clean-types",
+    "on:change": "yarn build",
     "watch": "watch \"yarn on:change\" --ignoreDirectoryPattern \"/dist/\""
   },
   "dependencies": {

packages/docsearch-js/rollup.config.js

@@ -1,40 +1,35 @@
 import replace from '@rollup/plugin-replace';
 
-import { plugins } from '../../rollup.base.config';
+import { plugins, typesConfig } from '../../rollup.base.config';
 import { getBundleBanner } from '../../scripts/getBundleBanner';
 
 import pkg from './package.json';
 
-if (!process.env.BUILD) {
-  throw new Error('The `BUILD` environment variable is required to build.');
-}
-
-const output = {
-  umd: {
-    file: 'dist/umd/index.js',
-    format: 'umd',
-    sourcemap: true,
-    name: 'docsearch',
-    banner: getBundleBanner(pkg),
-  },
-  esm: {
-    file: 'dist/esm/index.js',
-    format: 'es',
-    sourcemap: true,
-    banner: getBundleBanner(pkg),
+export default [
+  {
+    input: 'src/index.ts',
+    output: [
+      {
+        file: 'dist/umd/index.js',
+        format: 'umd',
+        sourcemap: true,
+        name: 'docsearch',
+        banner: getBundleBanner(pkg),
+      },
+      {
+        file: 'dist/esm/index.js',
+        format: 'es',
+        sourcemap: true,
+        banner: getBundleBanner(pkg),
+        plugins: [...plugins],
+      },
+    ],
+    plugins: [
+      ...plugins,
+      replace({
+        'process.env.NODE_ENV': JSON.stringify('production'),
+      }),
+    ],
   },
-};
-
-export default {
-  input: 'src/index.ts',
-  output: output[process.env.BUILD],
-  plugins:
-    process.env.BUILD === 'umd'
-      ? [
-          ...plugins,
-          replace({
-            'process.env.NODE_ENV': JSON.stringify('production'),
-          }),
-        ]
-      : plugins,
-};
+  typesConfig,
+];

packages/docsearch-react/button.js

@@ -1 +1 @@
-export { DocSearchButton } from './dist/esm/DocSearchButton.js';
+export { DocSearchButton } from './dist/esm';

packages/docsearch-react/modal.js

@@ -1 +1 @@
-export { DocSearchModal } from './dist/esm/DocSearchModal.js';
+export { DocSearchModal } from './dist/esm';

packages/docsearch-react/package.json

@@ -25,11 +25,10 @@
   "jsdelivr": "dist/umd/index.js",
   "scripts": {
     "build:clean": "rm -rf ./dist",
-    "build:esm": "babel src --root-mode upward --extensions '.ts,.tsx' --out-dir dist/esm",
-    "build:types": "tsc -p ./tsconfig.declaration.json --outDir ./dist/esm",
-    "build:umd": "rollup --config",
-    "build": "yarn build:clean && yarn build:umd && yarn build:esm && yarn build:types",
-    "on:change": "concurrently \"yarn build:esm\" \"yarn build:types\"",
+    "build:clean-types": "rm -rf ./dist/esm/types",
+    "build:types": "tsc -p ./tsconfig.declaration.json --outDir ./dist/esm/types",
+    "build": "yarn build:clean && yarn build:types && rollup --config && yarn build:clean-types",
+    "on:change": "yarn build",
     "watch": "watch \"yarn on:change\" --ignoreDirectoryPattern \"/dist/\""
   },
   "dependencies": {

packages/docsearch-react/rollup.config.js

@@ -1,28 +1,34 @@
 import replace from '@rollup/plugin-replace';
 
-import { plugins } from '../../rollup.base.config';
+import { plugins, typesConfig } from '../../rollup.base.config';
 import { getBundleBanner } from '../../scripts/getBundleBanner';
 
 import pkg from './package.json';
 
-export default {
-  input: 'src/index.ts',
-  external: ['react', 'react-dom'],
-  output: {
-    globals: {
-      react: 'React',
-      'react-dom': 'ReactDOM',
-    },
-    file: 'dist/umd/index.js',
-    format: 'umd',
-    sourcemap: true,
-    name: pkg.name,
-    banner: getBundleBanner(pkg),
+export default [
+  {
+    input: 'src/index.ts',
+    external: ['react', 'react-dom'],
+    output: [
+      {
+        globals: {
+          react: 'React',
+          'react-dom': 'ReactDOM',
+        },
+        file: 'dist/umd/index.js',
+        format: 'umd',
+        sourcemap: true,
+        name: pkg.name,
+        banner: getBundleBanner(pkg),
+      },
+      { dir: 'dist/esm', format: 'es' },
+    ],
+    plugins: [
+      ...plugins,
+      replace({
+        'process.env.NODE_ENV': JSON.stringify('production'),
+      }),
+    ],
   },
-  plugins: [
-    ...plugins,
-    replace({
-      'process.env.NODE_ENV': JSON.stringify('production'),
-    }),
-  ],
-};
+  typesConfig,
+];

packages/website/src/components/ApplyForm.js

@@ -77,14 +77,14 @@ function ApplyForm() {
       <Card className="uil-m-auto uil-ta-center apply-form">
         {state.message.startsWith('Your DocSearch') ? (
           <>
-          <Heading1 className="apply-text">URL Already Submitted!</Heading1>
-          <br />
-          <Text
-            className="uil-pv-8 uil-d-block apply-text"
-            aria-label="Request has already been processed"
-          >
-            {state.message}
-          </Text>
+            <Heading1 className="apply-text">URL Already Submitted!</Heading1>
+            <br />
+            <Text
+              className="uil-pv-8 uil-d-block apply-text"
+              aria-label="Request has already been processed"
+            >
+              {state.message}
+            </Text>
           </>
         ) : (
           <>

rollup.base.config.js

@@ -1,7 +1,8 @@
+import { babel } from '@rollup/plugin-babel';
 import json from '@rollup/plugin-json';
 import resolve from '@rollup/plugin-node-resolve';
 import replace from '@rollup/plugin-replace';
-import babel from 'rollup-plugin-babel';
+import dts from 'rollup-plugin-dts';
 import filesize from 'rollup-plugin-filesize';
 import { terser } from 'rollup-plugin-terser';
 
@@ -24,3 +25,9 @@ export const plugins = [
     showGzippedSize: true,
   }),
 ];
+
+export const typesConfig = {
+  input: 'dist/esm/types/index.d.ts',
+  output: [{ file: 'dist/esm/index.d.ts', format: 'es' }],
+  plugins: [dts()],
+};