fix: add esm and cjs paths to browser map for overriden files (mikeal#12)

* fix: add esm and cjs paths to browser map for overriden files

See evanw/esbuild#1443 for discussion.

In brief if you have a project that is built by ipjs and you have
file A that imports file B, esbuild (maybe others?) resolves file B
using it's full path within the module (e.g. including `esm` or `cjs`),
which it then uses as a key to look up overrides in the `browser` map
in your `package.json`.

If there is an override it'll fail to be found because ipjs doesn't
add paths prefixed with `esm` or `cjs` to the browser map where
overrides have been delcared in the `exports` map, so the change here
is to add files with their full path prefix to the `browser` map.

* fix: browser overrides in webpack

Author: achingbrain

src/package/index.js

@@ -190,6 +190,7 @@ class Package {
     json.browser = {}
     json.exports = {}
     const _join = (...args) => './' + join(...args)
+    const esmBrowser = {}
     for (const [key, ex] of Object.entries(this.exports)) {
       const _import = this.relative(await ex.import)
       const _browser = ex.browser ? this.relative(await ex.browser) : _import
@@ -199,15 +200,23 @@ class Package {
         import: _join('esm', _import)
       }
       json.browser[key] = _join('cjs', _browser)
+      if (_import !== _browser) {
+        json.browser[_join('esm', _import)] = _join('esm', _browser)
+        json.browser[_join('cjs', _import)] = _join('cjs', _browser)
+        esmBrowser[_import] = _browser
+      }
     }
     if (json.exports.import) {
       json.exports = json.exports.import
       json.browser = json.browser.import
     }
     let files = Promise.all(pending)
     pending.push(writeFile(new URL(dist + '/package.json'), JSON.stringify(json, null, 2)))
-    const typeModule = '{ "type" : "module" }'
-    pending.push(writeFile(new URL(dist + '/esm/package.json'), typeModule))
+    const typeModule = {
+      type: 'module',
+      browser: esmBrowser
+    }
+    pending.push(writeFile(new URL(dist + '/esm/package.json'), JSON.stringify(typeModule, null, 2)))
     await Promise.all(pending)
     files = await files
     return files

test/fixtures/pkg-kitchensink/output-main/esm/package.json

@@ -1 +1,6 @@
-{ "type" : "module" }
+{
+  "type": "module",
+  "browser": {
+    "./src/index.js": "./src/browser.js"
+  }
+}

test/fixtures/pkg-kitchensink/output-main/package.json

@@ -23,6 +23,8 @@
   },
   "browser": {
     ".": "./cjs/src/browser.js",
+    "./esm/src/index.js": "./esm/src/browser.js",
+    "./cjs/src/index.js": "./cjs/src/browser.js",
     "./secondary": "./cjs/src/secondary.js"
   }
 }

test/fixtures/pkg-kitchensink/output-notests/esm/package.json

@@ -1 +1,6 @@
-{ "type" : "module" }
+{
+  "type": "module",
+  "browser": {
+    "./src/index.js": "./src/browser.js"
+  }
+}

test/fixtures/pkg-kitchensink/output-notests/package.json

@@ -22,6 +22,8 @@
   },
   "browser": {
     ".": "./cjs/src/browser.js",
+    "./esm/src/index.js": "./esm/src/browser.js",
+    "./cjs/src/index.js": "./cjs/src/browser.js",
     "./secondary": "./cjs/src/secondary.js"
   }
 }

test/fixtures/pkg-kitchensink/output-tests/esm/package.json

@@ -1 +1,6 @@
-{ "type" : "module" }
+{
+  "type": "module",
+  "browser": {
+    "./src/index.js": "./src/browser.js"
+  }
+}

test/fixtures/pkg-kitchensink/output-tests/package.json

@@ -22,6 +22,8 @@
   },
   "browser": {
     ".": "./cjs/src/browser.js",
+    "./esm/src/index.js": "./esm/src/browser.js",
+    "./cjs/src/index.js": "./cjs/src/browser.js",
     "./secondary": "./cjs/src/secondary.js"
   }
 }