do not use dynamic require

Opentrons · Dec 2, 2024 · 80b7338 · 80b7338
1 parent 04283ec
commit 80b7338
Showing 1 changed file with 10 additions and 11 deletions.
diff --git a/components/vite.config.mts b/components/vite.config.mts
@@ -6,36 +6,35 @@ import postCssApply from 'postcss-apply'
 import postColorModFunction from 'postcss-color-mod-function'
 import postCssPresetEnv from 'postcss-preset-env'
 import lostCss from 'lost'
+import commonjs from '@rollup/plugin-commonjs' // Importing @rollup/plugin-commonjs to handle CJS to ESM conversion
 
 export default defineConfig({
   build: {
     // Relative to the root
     outDir: 'lib',
-    // do not delete the outdir, typescript types might live there and we dont want to delete them
+    // Do not delete the outdir, TypeScript types might live there, and we don't want to delete them
     emptyOutDir: false,
     lib: {
       entry: 'src/index.ts',
       formats: ['es', 'cjs'], // Generate both ES Module and CommonJS outputs
       fileName: format => (format === 'es' ? 'index.mjs' : 'index.cjs'),
     },
     rollupOptions: {
-      external: ['react', 'react-dom', 'styled-components'], // Externalize peer dependencies
+      external: ['react', 'react-dom', 'styled-components'], // Ensure peer dependencies are not bundled
       output: {
-        exports: 'named',
+        exports: 'named', // Use named exports for compatibility with styled-components in CJS
         globals: {
-          'styled-components': 'styled', // Use 'styled' as the global variable name
+          'styled-components': 'styled', // Ensure styled-components maps correctly in UMD builds
         },
         plugins: [
-          require('@rollup/plugin-commonjs')({
-            include: /node_modules/,
-            namedExports: {
-              'styled-components': ['default'], // Ensure default export is correctly mapped
-            },
+          commonjs({
+            include: /node_modules/, // Include node_modules for CommonJS conversion
+            transformMixedEsModules: true, // Ensure proper handling of mixed modules
           }),
         ],
       },
     },
-    target: 'es2017', // Transpile down to a compatible version for Next.js (for Protocol Library)
+    target: 'es2017', // Transpile down to a compatible version for Next.js
   },
   plugins: [
     react({
@@ -65,7 +64,7 @@ export default defineConfig({
   },
   define: {
     'process.env': process.env,
-    global: 'globalThis',
+    global: 'globalThis', // Fix issues with globalThis in some environments
   },
   resolve: {
     alias: {