I have a dependency error trying to add any of the plugins available for gatsby. This issue is there immediately after the first installation of gatsby and after running the command "gatsby create". Here below you can find all the details of the problem. Can someone please help to fix this issue? Thanks in advance.
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: @mdx-js/react@1.6.22
npm ERR! Found: react@18.1.0
npm ERR! node_modules/react
npm ERR! peer react@"15.x || 16.x || 17.x || 18.x" from @gatsbyjs/reach-router@1.3.7
npm ERR! node_modules/@gatsbyjs/reach-router
npm ERR! @gatsbyjs/reach-router@"^1.3.6" from gatsby@4.17.0
npm ERR! node_modules/gatsby
npm ERR! peer gatsby@"^4.0.0-next" from babel-plugin-remove-graphql-queries@4.17.0
npm ERR! node_modules/babel-plugin-remove-graphql-queries
npm ERR! babel-plugin-remove-graphql-queries@"^4.17.0" from gatsby@4.17.0
npm ERR! 2 more (gatsby-plugin-image, gatsby-plugin-typescript)
npm ERR! 13 more (gatsby-plugin-google-analytics, gatsby-plugin-image, ...)
npm ERR! peer @gatsbyjs/reach-router@"^1.3.5" from gatsby-link@4.17.0
npm ERR! node_modules/gatsby-link
npm ERR! gatsby-link@"^4.17.0" from gatsby@4.17.0
npm ERR! node_modules/gatsby
npm ERR! peer gatsby@"^4.0.0-next" from babel-plugin-remove-graphql-queries@4.17.0
npm ERR! node_modules/babel-plugin-remove-graphql-queries
npm ERR! 13 more (gatsby-plugin-google-analytics, gatsby-plugin-image, ...)
npm ERR! 1 more (gatsby-react-router-scroll)
npm ERR! peer react@"^16.9.0 || ^17.0.0 || ^18.0.0" from gatsby@4.17.0
npm ERR! node_modules/gatsby
npm ERR! peer gatsby@"^4.0.0-next" from babel-plugin-remove-graphql-queries@4.17.0
npm ERR! node_modules/babel-plugin-remove-graphql-queries
npm ERR! babel-plugin-remove-graphql-queries@"^4.17.0" from gatsby@4.17.0
npm ERR! 2 more (gatsby-plugin-image, gatsby-plugin-typescript)
npm ERR! peer gatsby@"^4.0.0-next" from gatsby-plugin-google-analytics@4.17.0
npm ERR! node_modules/gatsby-plugin-google-analytics
npm ERR! gatsby-plugin-google-analytics@"^4.17.0" from the root project
npm ERR! 12 more (gatsby-plugin-image, gatsby-plugin-manifest, ...)
npm ERR! 10 more (gatsby-link, gatsby-plugin-google-analytics, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.13.1 || ^17.0.0" from @mdx-js/react@1.6.22
npm ERR! node_modules/@mdx-js/react
npm ERR! peer @mdx-js/react@"^1.0.0" from gatsby-plugin-mdx@3.17.0
npm ERR! node_modules/gatsby-plugin-mdx
npm ERR! gatsby-plugin-mdx@"^3.17.0" from the root project
npm ERR! @mdx-js/react@"^1.6.22" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: react@17.0.2
npm ERR! node_modules/react
npm ERR! peer react@"^16.13.1 || ^17.0.0" from @mdx-js/react@1.6.22
npm ERR! node_modules/@mdx-js/react
npm ERR! peer @mdx-js/react@"^1.0.0" from gatsby-plugin-mdx@3.17.0
npm ERR! node_modules/gatsby-plugin-mdx
npm ERR! gatsby-plugin-mdx@"^3.17.0" from the root project
npm ERR! @mdx-js/react@"^1.6.22" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.```
