fix: use browser field object map instead of exports for webpack compatibility#84
Merged
Conversation
Remove the exports field (anti-pattern per constructive-pnpm standards) and use the browser field object form instead. This tells webpack and other bundlers to swap node-specific files for their browser-safe equivalents without requiring exports map complexity. The browser field maps both CJS and ESM entry points plus the internal localhost-fetch module to their .browser counterparts, ensuring no node:http/node:https references appear in browser bundles.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Fixes
@constructive-io/fetch@1.0.0breaking webpack builds for browser targets. The package usesrequire('node:http')andrequire('node:https')for*.localhostDNS routing in Node.js. Although wrapped in a runtime guard (process.versions?.node), webpack statically analyzes allrequire()calls and cannot resolvenode:URIs for browser targets.Approach: Split browser-safe entry points (
localhost-fetch.browser.ts,index.browser.ts) that only useglobalThis.fetch, and use thebrowserfield object map inpackage.jsonto tell bundlers to swap node-specific files for their browser counterparts.This follows the constructive-pnpm standard which explicitly says never use the
exportsmap — thebrowserfield object form achieves the same goal without that complexity:This is well-supported by webpack, browserify, rollup, vite, esbuild, and parcel.
Review & Testing Checklist for Human
@constructive-io/graphql-queryand@constructive-io/upload-clientwebpack builds succeed with this versionnode:http/node:httpslocalhost routing (themain/moduleentry points are unchanged)node:scheme references in the built browser files (dist/index.browser.js,dist/esm/index.browser.js)Notes
exportsfield which is an anti-pattern per constructive-pnpm standards. Replaced withbrowserfield object form which is simpler and equally effective.globalThis.fetch— no localhost workaround needed since browsers resolve*.localhostnatively.Link to Devin session: https://app.devin.ai/sessions/af68f5f456bb4faa9e937563ef2a5eb0
Requested by: @pyramation