除非提供了“--jsx”标志，否则不能使用 JSX

IT技术 reactjs typescript jsx tsx
2021-04-09 07:44:25

我已经环顾四周以寻找解决此问题的方法。他们都建议添加"jsx": "react"到您的 tsconfig.json 文件中。我所做的。另一个是添加"include: []"，我也做过。但是，当我尝试编辑.tsx文件时，我仍然收到错误消息。下面是我的 tsconfig 文件。

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "allowJs": true,
        "checkJs": false,
        "jsx": "react",
        "outDir": "./build",
        "rootDir": "./lib",
        "removeComments": true,
        "noEmit": true,
        "pretty": true,
        "skipLibCheck": true,
        "strict": true,
        "moduleResolution": "node",
        "esModuleInterop": true
    },
    "include": [
        "./lib/**/*"
    ],
    "exclude": [
        "node_modules"
    ]
}

任何的意见都将会有帮助。我正在使用 babel 7 编译所有带有 env、react 和 typescript 预设的代码。如果你们需要更多文件来帮助调试，请告诉我。

6个回答

我每次运行npm start，它会覆盖不管我配置{jsx: ...}与react-jsx在为了兼容JSX变换阵营17。

The following changes are being made to your tsconfig.json file:
  - compilerOptions.jsx must be react-jsx (to support the new JSX transform in React 17)

问题是 VSCode 使用旧版本的 typescript (4.0.3)，而项目附带的 typescript 版本是 (4.1.2)。

以下对我有用：

  1. 转到命令面板CTRL+ Shift+ P （或Mac 上的⌘+ Shift+ P）。
  2. 选择“typescript：选择typescript版本...”。
  3. 选择“使用工作区版本”。

VSCode 状态栏

VSCode 命令面板

TypeScript 工作区版本

谢谢，这对我有用。除非您在任何.tsx文件上，否则不会显示此选项。
2021-05-28 07:44:25
我什至没有选择将typescript版本更改为工作区版本。我只得到 4.0.3 的 VS Code 版本，即使我安装了 4.1.2。
2021-06-03 07:44:25
这对我有用，只需要改react-jsx回react.
2021-06-03 07:44:25
是的，如果您的应用程序不在工作区的顶级文件夹中，您可以按照code.visualstudio.com/docs/typescript/...
2021-06-04 07:44:25

除非提供了“--jsx”标志，否则不能使用 JSX

重新启动您的 IDE。有时 tsconfig.json 更改不会立即被接受 🌹

更改版本成功了！看看下面的答案:)
2021-05-23 07:44:25
错误仍然存​​在于我的机器上。看起来"jsx": "react-jsx"不是有效值。我收到以下错误Argument for '--jsx' option must be : 'preserve', 'react-native', 'react'.但create-react-app将其设置为"react-jsx". 我该怎么办？
2021-05-24 07:44:25
您还可以通过添加指向 tsserver.js 文件目录的 typescript.tsdk 工作区设置来告诉 VS Code 在特定工作区中使用特定版本的 TypeScript： "typescript.tsdk": "./node_modules/typescript/lib" code.visualstudio.com/docs/typescript/...
2021-06-16 07:44:25
我更改了 tsconfig.json，它起作用了，{ ..... "jsx": "react" }, "include": [ "src", "/node_modules/**/*" ] }。修改了“jsx:react”并添加了“node_modules/**/*”。
2021-06-19 07:44:25

对于阅读的人，请转到 tsconfig.json 并将该行从 更改react-jsx为react：

{
  "compilerOptions": {
    "jsx": "react"
  }
}

奖励：尝试将 IDE TS 版本设置为最新（atm 4.2），在 vscode CMD + SHIFT + P 中并从那里更改。

“jsx”：我的 tsconfig 中缺少“react”。添加它并解决了问题。
2021-05-22 07:44:25
运行后不幸yarn start还是npm start会返回到“反应- JSX” :(
2021-06-06 07:44:25

create-react-app 开箱即用。 AS OF 2021 DECEMBER

在 tsconfig 里面，include只设置为/src，改为：

  "include": [
    "./src/**/*.ts"
  ]
我什至没有选择将typescript版本更改为工作区版本。我只得到 4.0.3 的 VS Code 版本，即使我安装了 4.1.2。
2021-05-25 07:44:25
是的，我也有同样的设置
2021-05-26 07:44:25
Grymt，tackar！
2021-05-31 07:44:25
这有效。我差点没投赞成票，因为你有“33”票，33 是个不错的数字。
2021-06-14 07:44:25
@ Sapper6fd，是的。react-create-app的创建者谈到vscodetypescript和项目typescript不匹配，可能需要单独更新vscode/它的typescript？
2021-06-17 07:44:25

就我而言，问题是 VSCode 生成了一个空tsconfig.json文件，当然，它什么也没做。

我tsconfig.json从Typescript 的 React Page 中添加了这个：

{
    "compilerOptions": {
        "outDir": "./dist/",
        "sourceMap": true,
        "noImplicitAny": true,
        "module": "commonjs",
        "target": "es6",
        "jsx": "react"
    }
}

...然后点击save，VSCode 从那里拿走了它。

其它你可能感兴趣的问题
上一篇React 组件和 React 元素的区别 下一篇如何在 React 中使用注释