Use correct file extensions for exported ES modules

Author: colinrotherham

package.json

@@ -15,15 +15,15 @@
       "require": "./dist/cjs/components/*"
     },
     "#components": {
-      "import": "./dist/esm/components/index.js",
+      "import": "./dist/esm/components/index.mjs",
       "require": "./dist/cjs/components/index.js"
     },
     "#patterns/*": {
       "import": "./dist/esm/patterns/*",
       "require": "./dist/cjs/patterns/*"
     },
     "#patterns": {
-      "import": "./dist/esm/patterns/index.js",
+      "import": "./dist/esm/patterns/index.mjs",
       "require": "./dist/cjs/patterns/index.js"
     },
     "#util/*": {
@@ -35,7 +35,7 @@
     ".": {
       "import": {
         "types": "./dist/esm/index.d.ts",
-        "default": "./dist/esm/index.js"
+        "default": "./dist/esm/index.mjs"
       },
       "require": {
         "types": "./dist/cjs/index.d.ts",
@@ -46,7 +46,7 @@
     "./package.json": "./package.json"
   },
   "main": "dist/cjs/index.js",
-  "module": "dist/esm/index.js",
+  "module": "dist/esm/index.mjs",
   "types": "dist/esm/index.d.ts",
   "scripts": {
     "cleanup": "rm -rf dist/ > /dev/null && rm -rf lib/ > /dev/null",

rollup.config.mjs

@@ -12,16 +12,25 @@ const { outDir } = tsBuildConfig.compilerOptions;
 const external = Object.keys(packageJson.peerDependencies);
 
 export default defineConfig(
-  /** @type {const} */ (['cjs', 'esm']).map(
+  /** @type {const} */ ([
+    {
+      entryFileNames: '[name].js',
+      format: 'cjs',
+    },
+    {
+      entryFileNames: '[name].mjs',
+      format: 'esm',
+    },
+  ]).map(
     /**
      * Rollup options for each module format
      */
-    (format) => ({
+    (options) => ({
       input: 'src/index.ts',
       output: [
         {
-          dir: join(outDir, format),
-          format,
+          ...options,
+          dir: join(outDir, options.format),
           preserveModules: true,
           preserveModulesRoot: 'src',
           sourcemap: true,
@@ -38,7 +47,7 @@ export default defineConfig(
         typescript({
           tsconfig: 'tsconfig.build.json',
           compilerOptions: {
-            outDir: join(outDir, format),
+            outDir: join(outDir, options.format),
           },
         }),
         preserveDirectives(),