fix: add suport to ESM entrypoint and build it in separated chunks

.esbuild/build.js

@@ -1,16 +1,25 @@
-const baseConfig = require('./config');
+const config = require('./config');
+const esbuild = require('esbuild');
 
-const config = Object.assign({}, baseConfig, {
-  minify: true,
-  drop: ['debugger', 'console'],
-});
+(async () => {
+  try {
+    await Promise.all([
+      esbuild.build({
+        ...config,
+        format: 'cjs',
+        outdir: 'lib',
+        outExtension: { '.js': '.cjs' },
+      }),
 
-require('esbuild')
-  .build({
-    ...config,
-    outfile: 'lib/index.js',
-  })
-  .catch((error) => {
+      esbuild.build({
+        ...config,
+        format: 'esm',
+        outdir: 'lib',
+        splitting: true,
+      }),
+    ]);
+  } catch (error) {
     console.error(error);
     process.exit(1);
-  });
+  }
+})();

.esbuild/config.js

@@ -1,11 +1,15 @@
 require('dotenv').config();
 const { style } = require('./plugins/style-loader');
+const glob = require('glob');
 
 const entries = Object.entries(process.env).filter((key) => key[0].startsWith('SDK_'));
 const env = Object.fromEntries(entries);
+const entryPoints = glob
+  .sync('./src/**/*.ts')
+  .filter((file) => !file.endsWith('.d.ts') && !file.endsWith('.test.ts'));
 
-module.exports = {
-  entryPoints: ['./src/index.ts'],
+const config = {
+  entryPoints,
   loader: {
     '.png': 'file',
     '.svg': 'file',
@@ -16,9 +20,14 @@ module.exports = {
   },
   plugins: [style()],
   bundle: true,
-  target: 'es6',
-  format: 'esm',
+  color: true,
+  minify: false,
+  logLevel: 'info',
+  sourcemap: true,
+  chunkNames: 'chunks/[name]-[hash]',
   define: {
     'process.env': JSON.stringify(env),
   },
 };
+
+module.exports = config;

.esbuild/watch.js

@@ -1,22 +1,28 @@
-const baseConfig = require('./config');
+const config = require('./config');
 const esbuild = require('esbuild');
 
-const config = Object.assign({}, baseConfig, {
-  outfile: 'dist/index.js',
-});
-
 (async () => {
   try {
-    const context = await esbuild.context(config);
-    context.watch();
+    const [cjsContext, esmContext] = await Promise.all([
+      esbuild.context({
+        ...config,
+        format: 'cjs',
+        outdir: 'dist',
+        outExtension: { '.js': '.cjs' },
+      }),
+
+      esbuild.context({
+        ...config,
+        format: 'esm',
+        outdir: 'dist',
+        splitting: true,
+      }),
+    ]);
+
+    cjsContext.watch();
+    esmContext.watch();
   } catch (error) {
     console.error(error);
     process.exit(1);
   }
 })();
-
-// .build(config)
-// .catch((error) => {
-//   console.error(error);
-//   process.exit(1);
-// });

package.json

@@ -4,6 +4,10 @@
   "description": "SuperViz SDK",
   "main": "./lib/index.js",
   "types": "./lib/index.d.ts",
+  "exports": {
+    "import": "./lib/index.js",
+    "require": "./lib/index.cjs.js"
+  },
   "files": [
     "lib"
   ],