Unsafe builtin method was used, future builds will need to rebuild all pages - gatsby build

Question

I am facing this error during "gatsby build"

warning Unsafe builtin method was used, future builds will need to rebuild all pages warning WebpackError: Unsafe builtin usage fs.existsSync

please check the picture and package details below..

Package.Json

 "gatsby": "^3.1.1",
    "gatsby-plugin-create-client-paths": "^3.2.0",
    "gatsby-plugin-material-ui": "^3.0.1",
    "gatsby-plugin-typescript": "^3.2.0",
    "gatsby-source-contentful": "^5.2.1",
    "react": "^17.0.1",
    "react-chartjs-2": "^2.11.1",
    "react-dom": "^17.0.1",
    "react-redux": "^7.2.3",
    "storybook": "^6.2.8",
    "storybook-css-modules-preset": "^1.0.7",
    "typeface-roboto": "^1.1.13",
    "typescript": "^4.2.3",
    "yup": "^0.32.9"

Answer 1

The issue is caused by gatsby-plugin-material-ui plugin. You can follow the stack trace of the warning discussion here.

The resolution is to update the gatsby-plugin-material-ui to 3.0.0 version.

In your case, try downgrading to 3.0.0 rather than using 3.0.1. Remove your node_modules before each trial and remove your cache by gatsby clean.

Alternatively, you can try disabling the auto prefixing (not ideal solution):

{
  resolve: `gatsby-plugin-material-ui`,
  options: {
    disableAutoprefixing: true,
  },
},