Fixing webpack/node error: cannot resolve module ‘fs’

If you write a React application that does server side rendering, you can get a string of errors if you try to render some server side code on the client. This can occur if you depend on something like the git-rev or git-rev-sync plugins, which require access to the shell.

The way to fix this is to remove the dependency entirely. If you want to inject a value into your Javascript files (e.g. current version number) you can pull it in from JSON file, e.g. “require(‘./version.json’)” or have the build script depend on the git tool and inject it’s output into your Javascript files.

ERROR in ./~/git-rev-sync/~/graceful-fs/graceful-fs.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\graceful-fs
 @ ./~/git-rev-sync/~/graceful-fs/graceful-fs.js 1:9-22

ERROR in ./~/git-rev-sync/~/graceful-fs/fs.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\graceful-fs
 @ ./~/git-rev-sync/~/graceful-fs/fs.js 3:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/cd.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/cd.js 1:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/common.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/common.js 2:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/ls.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/ls.js 2:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/find.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/find.js 1:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/cp.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/cp.js 1:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/rm.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/rm.js 2:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/mv.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/mv.js 1:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/mkdir.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/mkdir.js 2:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/test.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/test.js 2:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/cat.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/cat.js 2:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/to.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/to.js 2:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/toEnd.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/toEnd.js 2:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/sed.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/sed.js 2:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/grep.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/grep.js 2:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/which.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/which.js 2:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/ln.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/ln.js 1:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/exec.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/exec.js 5:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/exec.js
Module not found: Error: Cannot resolve module 'child_process' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/exec.js 6:12-36

ERROR in ./~/git-rev-sync/~/shelljs/src/chmod.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/chmod.js 2:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/touch.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/touch.js 2:9-22

ERROR in ./~/git-rev-sync/~/shelljs/src/tempdir.js
Module not found: Error: Cannot resolve module 'fs' in D:\projects\image-annotation\node_modules\git-rev-sync\node_modules\shelljs\src
 @ ./~/git-rev-sync/~/shelljs/src/tempdir.js 3:9-22

ERROR in (webpack)/~/node-libs-browser/~/constants-browserify/constants.json
Module parse failed: D:\projects\image-annotation\node_modules\webpack\node_modules\node-libs-browser\node_modules\constants-browserify\constants.json Line 2: Unexpected token :
You may need an appropriate loader to handle this file type.
| {
|   "O_RDONLY": 0,
|   "O_WRONLY": 1,
|   "O_RDWR": 2,
 @ ./~/git-rev-sync/~/graceful-fs/polyfills.js 2:16-36