'Module not found: Can't resolve 'dns' in pg/lib

I did create-react-app and also installed sequelize and pg. But when I do npm start, I get the following error -


./node_modules/pg/lib/connection-parameters.js

Module not found: Can't resolve 'dns' in '/Users/vedant/Web Dev/device_psql/node_modules/pg/lib'

Here is the App.js file -


import React, { Component } from 'react';
const Sequelize = require('sequelize');
const sequelize = new Sequelize('postgres', 'postgres', 'password', {
host: 'localhost',
dialect: 'postgres',

pool: {
  max: 5,
  min: 0,
  acquire: 30000,
  idle: 10000
},

// http://docs.sequelizejs.com/manual/tutorial/querying.html#operators
operatorsAliases: false
});

class App extends Component {
render() {
  return (
    <div >
      <p>Test</p>
    </div>
  );
}
}

export default App;

Also, in the package.json file, I have sequelize and pg. What could be the problem? I have tried to delete the node_modules folder and doing npm install, but no luck.

Thanks in advance.



Solution 1:[1]

This is happening because one of your packages uses JavaScript promises, which depend on the dns module, which is only available in Node.js (server-side) and not when your code runs in the browser. Though the implementation depends on it, it does not require it to work, so you can solve the problem by faking the existence of the dns module.

To do so, follow these steps:

Create a folder /src/mock/dns. Inside this folder, create a file index.js containing:

module.exports = {}; 
module.exports.default = {};

Also inside this folder, create a file package.json containing:

{ 
  "name": "dns", 
  "version": "3.1.0", 
  "private": true 
}

In your root package.json, add the following line to dependencies:

"dns": "file:./src/mock/dns"

Run npm install to install the fake dependency, then restart your React project with npm start.

Solution 2:[2]

I ran into a similar issue when trying to use Nodemailer inside of Cloudflare Workers.

I was getting the following error with the Nodemailer package:

Module not found: Error: Can't resolve 'child_process' in '~/node_modules/nodemailer/lib/sendmail-transport'

When I researched the error, I found that Webpack is trying to bundle things for the client that can only be used in the server. See https://github.com/webpack/webpack/issues/744.

The solution was to add the externals property to my webpack.config.js file and include all the modules that cannot be resolved by Webpack. See https://github.com/webpack/webpack/issues/744#issuecomment-320437402.

My webpack.config.js file now looks like this:

module.exports = {
  target: "webworker",
  entry: "./index.js",
  externals: [
    "child_process",
    "dns",
    "fs",
    "net",
    "tls",
  ]
}

UPDATE: I discovered some new information that deals with Cloudflare Workers specifically, but that gets away from the original topic. So I created a new post: Cloudflare Workers: Module not found: Error: Can't resolve 'child_process' in '~/node_modules/nodemailer/lib/sendmail-transport' .

Solution 3:[3]

Importing fetch at the top of the file solved the issue for me.

import fetch from 'node-fetch';

Don't forget to install it before: Install node-fetch

Solution 4:[4]

You can encounter this if you try to use pg in code that will run on the browser, such as in an onSubmit or onClick handler. The obtuse error messages are from webpack trying to reference symbols that are stripped from the browser-destined output.

To resolve the problem, ensure that you make database queries and updates via REST API handlers or other server-side code.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Alexander van Oostenrijk
Solution 2
Solution 3 Kristian Munsche
Solution 4 Edward Brey