Unable to resolve module fs when running expo start - firebase

Question

Can't for the life of me figure out why my app suddenly won't start. I keep getting this error:
Unable to resolve module fs from
node_modules\firebase-admin\lib\firebase-namespace.js: fs could not
be found within the project.
If you are sure the module exists, try these steps:
Clear watchman watches: watchman watch-del-all
Delete node_modules and run yarn install
Reset Metro's cache: yarn start --reset-cache
Remove the cache: rm -rf /tmp/metro-*
whenever I run expo start in the root folder. I've even tried expo start -c to reset the cache.
I've also tried removing node_modules and npm installing it back for both the {myapp}/functions/node_modules and {myapp}/node_modules.
I've tried updating firebase-admin and all dependencies.
It's weird because my app was working a couple days ago and this came out of the blue. I've never had to install fs before.
Anyone got any idea what's going on here? It feels like a simple environment fix, but I'm not sure.
My app dependencies if it helps:
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject",
"test": "jest"
},
"dependencies": {
"#react-native-async-storage/async-storage": "^1.13.0",
"#react-native-community/masked-view": "0.1.10",
"algoliasearch": "^4.8.3",
"axios": "^0.21.1",
"buffer": "^6.0.3",
"expo": "^41.0.0",
"expo-font": "~9.1.0",
"expo-image-picker": "~10.1.4",
"expo-linear-gradient": "~9.1.0",
"expo-notifications": "~0.11.6",
"expo-status-bar": "~1.0.4",
"expo-web-browser": "~9.1.0",
"react": "16.13.1",
"react-dom": "16.13.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-41.0.0.tar.gz",
"react-native-elements": "^3.0.0-alpha.1",
"react-native-gesture-handler": "~1.10.2",
"react-native-keyboard-aware-scroll-view": "^0.9.3",
"react-native-linear-gradient": "^2.5.6",
"react-native-paper": "^4.7.0",
"react-native-reanimated": "^1.13.3",
"react-native-screens": "^2.10.1",
"react-native-snap-carousel": "^3.9.1",
"react-native-svg": "12.1.0",
"react-native-svg-transformer": "^0.14.3",
"react-native-vector-icons": "^7.1.0",
"react-navigation": "^4.4.3",
"react-navigation-drawer": "^2.6.0",
"react-navigation-header-buttons": "^6.3.1",
"react-navigation-stack": "^2.9.0",
"react-navigation-tabs": "^2.10.1",
"react-redux": "^7.2.2",
"redux": "^4.0.5",
"redux-thunk": "^2.3.0"
},
"devDependencies": {
"firebase": "8.2.3",
"jest": "^26.6.3",
"jest-expo": "^41.0.0",
"react-test-renderer": "^17.0.2"
},
"private": true,
"jest": {
"preset": "jest-expo",
"transformIgnorePatterns": [
"./node_modules/(?!(react-navigation-header-buttons|react-native|react-native-gesture-handler|#expo)|expo-font|#unimodules|expo-asset|expo-constants|expo-file-system|expo-web-browser|react-navigation|react-navigation-stack|unimodules-permissions-interface|expo-permissions|expo-image-picker|expo-linear-gradient/)"
],
"setupFiles": [
"./node_modules/react-native-gesture-handler/jestSetup.js"
],
"verbose": true,
"updateSnapshot": true
}
}
and .babelrc:
{
"presets": [
"babel-preset-expo"
]
}
and firebase functions dependencies:
{
"name": "functions",
"description": "Cloud Functions for Firebase",
"scripts": {
"serve": "firebase emulators:start --only functions",
"shell": "firebase functions:shell",
"start": "npm run shell",
"deploy": "firebase deploy --only functions",
"logs": "firebase functions:log"
},
"engines": {
"node": "12"
},
"main": "index.js",
"dependencies": {
"algoliasearch": "^4.8.3",
"axios": "^0.21.0",
"cloudinary": "^1.23.0",
"crypto": "^1.0.1",
"events": "^3.3.0",
"express": "^4.17.1",
"firebase": "^8.7.0",
"firebase-admin": "^9.10.0",
"firebase-functions": "^3.14.1"
},
"devDependencies": {
"firebase-functions-test": "^0.2.0"
},
"private": true
}
firebase-admin is then intialized in my {myapp}/functions/index.js as:
const admin = require("firebase-admin");
admin.initializeApp();
and then used as (for example):
// Called for toggling Tutorial Prompt on ProfileScreen
exports.setTutorialPrompt = functions.https.onRequest(async (req, res) => {
res.set("Access-Control-Allow-Origin", "*");
if (req.method === "OPTIONS") {
// Send response to OPTIONS requests
res.set("Access-Control-Allow-Methods", "GET, POST");
res.set("Access-Control-Allow-Headers", "Content-Type");
res.set("Access-Control-Max-Age", "3600");
res.status(201).send("CORS preflight options set!");
} else {
const db = admin.firestore(); // <--------------------------- here
const { exampleId, ExampletwoId, value, screen } = req.body;
const updatedProfile = {
tutorialPrompt: value,
};
const index = await client.initIndex(ALGOLIA_INDEX_NAME);
index
.partialUpdateObject({
objectID: ExhibitUId,
tutorialPrompt: value,
})
.wait();
db.collection("users").doc(localId).update(updatedProfile);
res.status(201).send(`Successfully toggled tutorialing prompt`);
}
});

Answer 1

I managed to fix it.
It was a random import error within the root app folder. Somehow one of my imports got mixed up, and was trying to call a cloud function instead of a redux-action function.
The wrong import:
import { setTutorialPrompt } from "../../functions/index.js";
The correct import:
import { setTutorialPrompt } from "../../store/actions/user";
Since it was trying to import my functions folder, it gave me the fs error. Similar to what #brentvatne was talking about.
If anyone else runs into this error, I recommend moving your cloud functions folder to your desktop or something, and try running your app without it. That's how I found the right error code.

Answer 2

I found this because I ran into pretty much exactly this same issue.
I discovered that there are (weirdly) two ways you can import firebase-admin into react native projects. I was doing import { firestore } from "firebase-admin" and I needed to be doing import firestore from '#react-native-firebase/firestore'
A pretty easy-to-miss difference, so I thought I’d leave a comment here in case anyone else has this issue.