Unable to resolve module ./node_modules/expo-router/entry in monorepo
#748
Comments
|
This also happens with yarn, even though it clearly exists |
hyoretsu
changed the title
./node_modules/expo-router/entry in monorepo
|
Tracked it down, it's an issue with monorepos, at least PNPM's. I can run it just fine in an isolated project. |
|
Create an import "expo-router/entry"Then remove the |
|
Thank you. That should be noted in the docs somewhere though, RN monorepo's already hard as it is. |
i'm still getting the below error only when building in release mode even after verifying the above. ❌ Metro encountered an error: |
|
@nathan-charles Its hard for us to assist you with a filepath issue when we cannot see your repo. Can you please create a new issue with a reproduction repo so we can assit you. |
|
@marklawlor Thanks for the reply I was finally was able to resolve my issue first I had to remove the See the release notes here: |
|
tried the
I tried the same thing but got this error instead. react-dom.development.js:18687 The above error occurred in the <withDevTools(Anonymous)> component: Consider adding an error boundary to your tree to customize error handling behavior. |
|
I just created a fresh app:
Installed the modules with yarn & tested again with npm. Doing package.json: app.json: |
|
Okay I've been wrestling with getting the full pnpm experience with React Native (using expo router) without making any compromises like Creating a new entry point file does work for me as shown in this #748 (comment) import "expo-router/entry";But even after updating I'm guessing most folks who want to place their React Native projects inside a pnpm monorepo are also sharing code from tailwind packages etc. So here's my finished article. With this config pnpm monorepo's work like a charm and Metro can be easily extended. {
...
"expo": "^51.0.17",
"expo-router": "~3.5.23",
"react-native": "^0.74.5",
...
}// Learn more: https://docs.expo.dev/guides/monorepos/
const path = require("path");
const { getDefaultConfig } = require("expo/metro-config");
const { FileStore } = require("metro-cache");
const { withNativeWind } = require("nativewind/metro");
const { makeMetroConfig } = require("@rnx-kit/metro-config");
const { mergeConfig } = require("metro-config");
const MetroSymlinksResolver = require("@rnx-kit/metro-resolver-symlinks");
const symlinksResolver = MetroSymlinksResolver();
const projectDir = __dirname;
const monorepoRoot = path.resolve(projectDir, "../..");
const defaultConfig = getDefaultConfig(projectDir);
/** @type {import('expo/metro-config').MetroConfig} */
const monorepoConfig = {
resolver: {
disableHierarchicalLookup: true,
nodeModulesPaths: [
path.resolve(projectDir, "node_modules"),
path.resolve(monorepoRoot, "node_modules"),
],
/**
* React Native has very frail symlink support for modern monorepo tools
* that rely on symlinks and global caches to dramatically increase the
* performance of installs e.g. pnpm. The best way around this is using
* Microsoft's rnx-kit. I've written more extensively about this in the
* README.
*
* @see https://gist.github.com/Zn4rK/ed60c380e7b672e3089074f51792a2b8
*/
resolveRequest: (context, moduleName, platform) => {
try {
// Symlinks resolver throws when it can't find what we're looking for.
const res = symlinksResolver(context, moduleName, platform);
if (res) {
return res;
}
} catch {
/**
* If we have an error, we pass it on to the next resolver in the chain,
* which should be one of expos.
* @see https://github.com/expo/expo/blob/9c025ce7c10b23546ca889f3905f4a46d65608a4/packages/%40expo/cli/src/start/server/metro/withMetroResolvers.ts#L47
*/
return context.resolveRequest(context, moduleName, platform);
}
},
},
/**
* Add the monorepo paths to the Metro config.
* This allows Metro to resolve modules from the monorepo.
*
* @see https://docs.expo.dev/guides/monorepos/#modify-the-metro-config
*/
watchFolders: [monorepoRoot],
/**
* Move the Metro cache to the `node_modules/.cache/metro` folder.
* This repository configured Turborepo to use this cache location as well.
* If you have any environment variables, you can configure Turborepo to invalidate it when needed.
* @see https://turbo.build/repo/docs/reference/configuration#env
*/
cacheStores: [
new FileStore({
root: path.join(projectDir, "node_modules", ".cache", "metro"),
})
]
};
/** @type {import('expo/metro-config').MetroConfig} */
const svgConfig = {
resolver: {
assetExts: defaultConfig.resolver.assetExts.filter((ext) => ext !== "svg"),
sourceExts: [...defaultConfig.resolver.sourceExts, "svg"],
},
transformer: {
// <3 -> https://github.com/kristerkari/react-native-svg-transformer/issues/141
assetPlugins: ['expo-asset/tools/hashAssetFiles'],
babelTransformerPath: require.resolve('react-native-svg-transformer/expo'),
},
};
/**
* Merging configs do not deeply merge arrays/functions. Keep this in mind to not
* override important properties. Order matters!
*
* @see https://metrobundler.dev/docs/configuration/#merging-configurations
*/
const finalConfig = makeMetroConfig(mergeConfig(defaultConfig, monorepoConfig, svgConfig));
/**
* Nativewind config must come last! Internally it uses withCssInterop to
* resolve css imports. If this is overridden, Nativewind will not work.
*
* @see https://github.com/nativewind/nativewind/issues/972#issuecomment-2329660147
*
* Striking a balance between Nativewind and rnx-kit was tricky
*
* @see https://github.com/nativewind/nativewind/issues/926
*/
module.exports = withNativeWind(finalConfig, {
input: path.join(projectDir, "./src/global.css"),
configPath: path.join(projectDir, "./tailwind.config.ts")
}); |
|
@Chibuife if you already use $ EXPO_USE_METRO_WORKSPACE_ROOT=1 npx expo start |
Which package manager are you using? (Yarn is recommended)
pnpm (known issues due to Metro)
Summary
I can't start an app with Expo Router v2, Expo 49 and PNPM. I already tried
expo-router/entryand manually specifying the node_modules path to both local and workspace. I also already tried with and without the.npmrcsettings.Minimal reproducible example
numerical-analysis.zip
The text was updated successfully, but these errors were encountered: