Adding gatsby-plugin-typescript to GatsbyJS "React is not defined"
In my case, I ran into this problem when I configured the typescript like this:
plugins: [ { resolve: `gatsby-plugin-typescript`, options: { isTSX: true, // defaults to false jsxPragma: `jsx`, // defaults to "React" allExtensions: true, // defaults to false }, }, // (continues...) ]
I changed into the default plugin:
plugins: [ `gatsby-plugin-typescript`, // (continues...) ]
This fixed the problem for me.
I found this fix from following article: https://github.com/ChristopherBiscardi/gatsby-mdx/issues/358
This configuration in the page on adding Typescript to Gatsby
// gatsby-config.jsmodule.exports = { plugins: [ { resolve: `gatsby-plugin-typescript`, options: { isTSX: true, // defaults to false jsxPragma: `jsx`, // defaults to "React" allExtensions: true, // defaults to false }, }, ],}
If you change this line
jsxPragma: `jsx`,
to
jsxPragma: `React`,
your code will work.
This youtube video helped me work through this issue: https://www.youtube.com/watch?v=ji2TtRVlNDQ&t=0s&list=PLgKwx4S6vKoDzRNhzNH8X0cm0lnw6MDIq&index=24