将 gatsby-plugin-typescript 添加到 GatsbyJS“React 未定义”

Question

我创建了 hello world GatsbyJS 应用程序，然后添加了 typescript 插件，我立即收到错误“React 未定义”。我经历了添加“import * as React from 'react'”的步骤；但我仍然在 /cache/app.js 中抛出相同的错误。我不确定接下来的步骤。

你好世界 GatsybyJS：https ://www.gatsbyjs.org/tutorial/part-zero/#create-a-gatsby-site

添加打字稿：https ://www.gatsbyjs.org/packages/gatsby-plugin-typescript/ ?= by-config.js

有没有人遇到过同样的问题？

Answer 1

就我而言，当我像这样配置打字稿时遇到了这个问题：

  plugins: [
    {
      resolve: `gatsby-plugin-typescript`,
      options: {
        isTSX: true, // defaults to false
        jsxPragma: `jsx`, // defaults to "React"
        allExtensions: true, // defaults to false
      },
    },
    // (continues...)
  ]

我改成了默认插件：

  plugins: [
    `gatsby-plugin-typescript`,
    // (continues...)
  ]

这为我解决了问题。

我从以下文章中找到了此修复程序：https : //github.com/ChristopherBiscardi/gatsby-mdx/issues/358

Answer 2

将 Typescript 添加到 Gatsby页面中的此配置

// gatsby-config.js
module.exports = {
  plugins: [
    {
      resolve: `gatsby-plugin-typescript`,
        options: {
          isTSX: true, // defaults to false
          jsxPragma: `jsx`, // defaults to "React"
          allExtensions: true, // defaults to false
        },
     },
  ],
}

如果你改变这一行

jsxPragma: `jsx`,

到

jsxPragma: `React`,

你的代码会起作用。

Answer 3

也许你需要添加yarn add typescript @types/node @types/react @types/react-dom