Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Module not found: Error: Cannot resolve module 'fs'

I'm making a react app using Babel and Webpack and I want to use the file-exists package from npm. I already installed and saved the package as a dependency for my project. After running npm start I get this error:

ERROR in ./~/file-exists/index.js
Module not found: Error: Cannot resolve module 'fs' in C:\GitHub\CryptoPrices\node_modules\file-exists
@ ./~/file-exists/index.js 3:9-22

file-exists uses fs as a dependency but for some reason it is not working. Npm starts and runs without any issues if I don't require file-exists anywhere.

here is my webpack config file:

module.exports = {
  entry: [
    './src/index.js'
  ],
  output: {
    path: __dirname,
    publicPath: '/',
    filename: 'bundle.js'
  },
  module: {
    loaders: [{
      // exclude: /node_modules/,
      loader: 'babel',
      query: {
        presets: ['react', 'es2015', 'stage-1']
      }
    }]
  },
  resolve: {
    extensions: ['', '.js', '.jsx']
  },
  devServer: {
    historyApiFallback: true,
    contentBase: './'
  }
};

I'm new to Webpack and Babel so I'm a little bit lost.

like image 943
Jorge Eduardo Sosa Avatar asked Jan 20 '18 16:01

Jorge Eduardo Sosa


People also ask

Can not find fs module?

To solve the "Cannot find module fs or its corresponding type declarations" error, install the types for node by running the command npm i -D @types/node . You can then import fs with the following line of code import * as fs from 'fs' .

Can't resolve fs in react export Excel?

After some research, it seems that 'fs' (which is used to interact with file system) was removed from react-scripts 5. So the only solution is to either use react-scripts 4.0. 3, or use another Excel library.

How do I fix module not found error in react?

To solve the "Module not found: Can't resolve" error in React, make sure to install the package from the error message if it's a third-party package, e.g. npm i somePackage . If you got the error when importing local files, correct your import path.

Do I need to install fs module?

This module is for handling the file system, as fs stands for the file system. There is no need to install this module, as it is available as a built-in module that comes with the installation of Node. js.


2 Answers

node: {
  fs: 'empty'
}

try to add the code above to your webpack config file and the error should disappear.

like image 65
Ihor Lavs Avatar answered Oct 05 '22 20:10

Ihor Lavs


It looks like you're calling the fs file-exists method in your index.js file. I'm not sure in what context you're calling the method, but this looks like a client-side call to a server-side method. I ran into a similar issue just recently.

From what I understand, the main issue seems to be that you can't call server-side (Node) methods in browser-interpreted client-side (front end) code. You have to call them from a server.

Webpack can load the fs module code into your front end, but the browser can't actually interpret those Node methods and run them; only a Node environment can do that. (more here)

You could fix the core issue by modifying the call to fs methods to happen somewhere server-side, or by finding an equivalent browser-supported package that offers the same functionality as the fs methods you need but that can be run in a browser.

A quick search for "fs module for browser" brings up a variety of options that might work for what you need, like fs-web, browserify-fs or filer.

Here is a similar question with some insight. Use fs module in React.js,node.js, webpack, babel,express

like image 24
jess Avatar answered Oct 05 '22 19:10

jess