Gatsby + React moralis

Moralis General
#1

I am trying to use react-moralis with gatsby and when I try to run the project I get this

Module not found: Error: Can’t resolve ‘electron’ in “…\node_modules\swarm-js\node_modules\got”

This is what my package.json looks like:

{
  "name": "meowster-purrfect",
  "version": "1.0.0",
  "private": true,
  "description": "Meowster Purrfect",
  "author": "wahaj-47",
  "keywords": [
    "gatsby"
  ],
  "scripts": {
    "develop": "gatsby develop",
    "start": "gatsby develop",
    "build": "gatsby build",
    "serve": "gatsby serve",
    "clean": "gatsby clean"
  },
  "dependencies": {
    "@walletconnect/web3-provider": "^1.7.0",
    "framer-motion": "^5.4.5",
    "gatsby": "^4.3.0",
    "gatsby-plugin-image": "^2.3.0",
    "gatsby-plugin-react-helmet": "^5.3.0",
    "gatsby-plugin-sharp": "^4.3.0",
    "gatsby-source-filesystem": "^4.3.0",
    "gatsby-transformer-sharp": "^4.3.0",
    "moralis": "^0.0.157",
    "node-polyfill-webpack-plugin": "^1.1.4",
    "react": "^17.0.1",
    "react-dom": "^17.0.1",
    "react-helmet": "^6.1.0",
    "react-infinite-scroll-component": "^6.1.0",
    "react-moralis": "^0.3.1"
  }
}
#2

I added this code to gatsby-node.js and its working now

const NodePolyfillPlugin = require("node-polyfill-webpack-plugin");
const webpack = require("webpack");

exports.onCreateWebpackConfig = ({ actions }) => {
  actions.setWebpackConfig({
    plugins: [
      new NodePolyfillPlugin(),
      new webpack.IgnorePlugin({
        resourceRegExp: /^electron$/,
      }),
    ],
  });
};

I have no idea what this does so if anyone can explain that would be great. Thanks

1 Like