Thanks to visit codestin.com
Credit goes to github.com

Skip to content

fix(metro): Add support for cjs extension in metro.config.js #2689

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
May 29, 2024
Merged

fix(metro): Add support for cjs extension in metro.config.js #2689

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
cf71268
fix(metro): Add support for cjs extension in metro.config.js
jamonholmgren May 22, 2024
b29ecfb
Add comments about inlineRequires and Reactotron
jamonholmgren May 22, 2024
2c4bf4f
Remove `experimentalInlineRequires` from metro config
jamonholmgren May 29, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions boilerplate/app/app.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,9 +11,9 @@
* if you're interested in adding screens and navigators.
*/
if (__DEV__) {
// Load Reactotron configuration in development. We don't want to
// include this in our production bundle, so we are using `if (__DEV__)`
// to only execute this in development.
// Load Reactotron in development only.
// Note that you must be using metro's `inlineRequires` for this to work.
// If you turn it off in metro.config.js, you'll have to manually import it.
require("./devtools/ReactotronConfig.ts")
}
import "./i18n"
Expand Down
10 changes: 9 additions & 1 deletion boilerplate/metro.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,17 @@ const config = getDefaultConfig(__dirname);

config.transformer.getTransformOptions = async () => ({
transform: {
experimentalImportSupport: false,
// Inline requires are very useful for deferring loading of large dependencies/components.
// For example, we use it in app.tsx to conditionally load Reactotron.
// However, this comes with some gotchas.
// Read more here: https://reactnative.dev/docs/optimizing-javascript-loading
// And here: https://github.com/expo/expo/issues/27279#issuecomment-1971610698
inlineRequires: true,
},
});

// This helps support certain popular third-party libraries
// such as Firebase that use the extension cjs.
config.resolver.sourceExts.push("cjs")

module.exports = config;