react native sudden Unable to resolve module `fs` error

user_9244191 0
Viewed 11481

I got a sudden error that the module 'fs' is unable to resolve. But I have not used this module nor changed anything. My App suddenly returns this error while starting.

error: bundling failed: Error: Unable to resolve module fs from /Path/to/Project/node_modules/handlebars/lib/index.js: Module fs does not exist in the Haste module map

This might be related to https://github.com/facebook/react-native/issues/4968 To resolve try the following:

  1. Clear watchman watches: watchman watch-del-all.
  2. Delete the node_modules folder: rm -rf node_modules && npm install.
  3. Reset Metro Bundler cache: rm -rf /tmp/metro-bundler-cache-* or npm start -- --reset-cache.
  4. Remove haste cache: rm -rf /tmp/haste-map-react-native-packager-*.

I already tried the four steps to resolve, several times but nothing helped. Any ideas what could be wrong?

react-navigation react-native reactjs fs
7 Answers

For me, the issue was that VSCode had inserted some imports at the top of one of my js files. Very odd. These were the lines:

import { tsConstructorType } from '@babel/types';
import { logger } from 'handlebars';
user_8909440

One of my node modules is depending on react-native-dotenv, but its code was using old import like import {} from 'react-native-dotenv'. But latest version of dotenv is using import {} from '@env'. Fixing this import in the module resolved the problem.

user_145057040

Usually you can fix these surprise errors by clearing your cache. Run $ expo start --clear.

user_6307520
user_72721090

I had exactly this issue. Visual Studio Code users, autocomplete will sometimes auto-import modules you have no need for at the top of your file without you noticing. Running git diff revealed the following lines I had no memory of every writing at the top of a file I'd worked on:

+import { clearConfigCache } from 'prettier';
+import { createIconSetFromFontello } from 'react-native-vector-icons';

How to avoid:

Run git diff and read every single line that follows. The offenders will usually turn up.

user_69419720

If you are importing a module (a functional/class component from another file) in expo react native, be sure to mention "./" in the assets array of the rnpm object in the package.json file like this:

"rnpm": {
    "assets": [
      "./"
    ]
  }

Do not try to install "fs" module separately, it would give more errors.

user_155134600

my auto-suggestion accidentally imported this in my file which caused the same problem.

import { status } from "express/lib/response";

I removed and it worked. try to find something in import that should not be there like from backend imports.

user_119100980
Related