Fixed CRA(react-scripts) compatibility issue #184
Conversation
|
Important Review skippedReview was skipped due to path filters ⛔ Files ignored due to path filters (1)
CodeRabbit blocks several paths by default. You can override this behavior by explicitly including those paths in the path filters. For example, including You can disable this status message by setting the WalkthroughRenamed library entry keys in vite.config.ts from "components" and "utils" to "components/index" and "utils/index". Added "react-dom" to both build.lib.external and build.rollupOptions.external to be treated as an external dependency. Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Possibly related PRs
Suggested reviewers
Pre-merge checks and finishing touches✅ Passed checks (3 passed)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
package.jsonis excluded by!**/*.json
📒 Files selected for processing (1)
vite.config.ts(2 hunks)
🔇 Additional comments (2)
vite.config.ts (2)
42-42: LGTM!Correctly externalizes
react-domas a peer dependency to prevent bundling React DOM into the library.
22-23: Approve: package.json exports & typesVersions align with updated entry structure.
| "react-router": resolve( | ||
| __dirname, | ||
| "src/components/react-router-dom/index.ts", | ||
| "src/components/react-router-dom/index.ts" | ||
| ), |
There was a problem hiding this comment.
🧩 Analysis chain
Consider consistency with the react-router entry naming.
The react-router entry key doesn't follow the /index suffix pattern used for components/index and utils/index. Verify whether this is intentional based on how ./react-router is exported in package.json, or if it should be renamed to "react-router/index" for consistency.
🏁 Script executed:
#!/bin/bash
# Check how react-router is exported in package.json
jq '.exports."./react-router"' package.jsonLength of output: 4
🏁 Script executed:
#!/bin/bash
rg -nP 'alias:\s*{' -n vite.config.ts -C20Length of output: 0
🏁 Script executed:
#!/bin/bash
file=$(fd vite.config.ts | head -n1 || find . -type f -name vite.config.ts | head -n1)
echo "Inspecting Vite config at: $file"
sed -n '1,200p' "$file"Length of output: 1776
🏁 Script executed:
#!/bin/bash
jq '.exports' package.json || echo "No exports field in package.json"Length of output: 540
Add or align the react-router subpath export to match your build entry
The library build defines a react-router entry (vite.config.ts, lib.entry → "react-router"), but package.json’s exports lacks ./react-router. Either rename the entry key to react-router/index (like your other /index entries) and map ./react-router → dist/react-router/index.* in exports, or keep it as-is and add an ./react-router export pointing to dist/react-router.*.
🤖 Prompt for AI Agents
In vite.config.ts around lines 24–27 the lib entry defines "react-router" but
package.json exports lacks a ./react-router subpath, causing a mismatch; fix by
either renaming the Vite lib entry to "react-router/index" to match your other
index-based entries and then add an exports mapping of "./react-router":
"dist/react-router/index.*" in package.json, or keep the current entry name and
add "./react-router": "dist/react-router.*" to package.json exports; ensure the
export path you add matches the actual built file names and update any other
export/entry keys to stay consistent.
2 participants
I updated the SDK’s package.json and vite.config.ts configuration to properly support both modern bundlers and legacy environments such as Create React App (CRA).
Previously, the CRA project couldn’t resolve subpath imports like:
import { LogoutLink } from "@kinde-oss/kinde-auth-react/components";
because react-scripts (Webpack 4) doesn’t fully recognize the exports field by default.
To resolve this, I added explicit subpath definitions under "exports" and configured "typesVersions" to correctly point to the built declaration files.
Fixes #186