除非提供“--jsx”标志,否则无法使用 JSX

2023-12-10

我四处寻找这个问题的解决方案。他们都建议添加"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 预设来编译所有代码。如果你们需要更多文件来帮助调试,请告诉我。


每次我跑步npm start,它会覆盖我配置的任何内容{jsx: ...} with react-jsx为了兼容 React 17 中的 JSX 转换。

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. Go to the command palette CTRL+Shift+P (Or +Shift+P on Mac).
  2. 选择“TypeScript:选择 TypeScript 版本...”。
  3. 选择“使用工作区版本”。

VSCode status bar

VSCode command palette

TypeScript workspace version

PS:除非您使用任何 .tsx 文件,否则此选项不会显示(感谢 @awran5 的评论和良好的收获)

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

除非提供“--jsx”标志,否则无法使用 JSX 的相关文章

  • 使用react redux获取删除请求方法不删除

    我正在尝试使用 fetch 删除请求方法来使用 React redux 删除本地主机服务器中的项目 调用方法 deleteItem e e preventDefault const id this props id this props d
  • 使用 useState 更新状态时功能组件不更新 DOM

    EDIT 代码笔在这里https codepen io mark kelly the looper pen abGBwzv https codepen io mark kelly the looper pen abGBwzv 我有一个显示
  • Sign in With Google (GSI) 库的 TypeScript 类型声明在哪里?

    我正在使用以下方式实现 使用 Google 登录 Google GSI 库 https developers google com identity gsi web guides overview 我的应用程序使用 Next js 和 Ty
  • CRA 的 src 之外的测试文件夹?

    我为我创建的应用程序编写测试npx create react app template typescript但我不知道如何将测试文件保存在组件旁边或单独的文件夹中test 我想我应该创造test文件夹外src src App tsx etc
  • 使用函数重载进行解构

    我正在尝试创建一个函数 该函数需要一对坐标或一个对象x and y属性并返回邻居列表 但由于某种原因 即使我检查了它的类型 我也无法解构该对象 interface Coords x number y number public getNei
  • 如何将require转化为第三方库的import语句?

    在我的打字稿项目中我使用 const program require commander const figlet require figlet const AWS require aws sdk 我想重构这些线路以通过import相反 为
  • Ant design Tabs onClick 函数

    我使用 Ant 设计创建了选项卡 在第二个选项卡中 当我单击我想要触发的按钮或更改为第一个选项卡时 有一个按钮 这是我的代码
  • Jest - 测试使用react-router的组件

    我正在测试一个呈现具有以下 contextTypes 的子组件的组件 Component contextTypes router PropTypes object isRequired 我对笑话完全陌生 但来自摩卡 酶我从未遇到过这个问题
  • 如何让 Typescript 获取声明文件?

    My file src auth ManagementAPI ts使用 Auth0 我需要使用自己的声明文件并创建src types auth0 d ts 然而 当我跑步时ts node 我收到此错误 TSError Unable to c
  • 如何对 NestJS 中的控制器应用防护进行单元测试?

    我在 NestJS 中配置了一个控制器 我想检查是否设置了适当的防护 有人有如何完成此操作的示例吗 这个 删节的 示例作为一个应用程序可以正常工作 所以我只是在测试指导之后 您会注意到在用户测试中有一些我正在调用的测试Reflect get
  • Angular 2发送数组另一页

    我正在使用 Angular 开发天气应用程序 我是 Angular 的新手 我想带上我选择的城市的天气信息 但我无法将数据发送到第二页 哪里有问题 预先感谢您的帮助 export class ForecastComponent implem
  • React Router Tabs——保持组件安装

    我使用 React Router 创建了选项卡 每个选项卡都有不同的路线 但是 我想通过保持隐藏选项卡的安装来维护选项卡转换之间的选项卡状态 我该如何实现这一目标 每次路由切换时 React 路由器都会重新安装每个组件 已经有人问过这个问题
  • Mobile Safari 在 play() 时跳过 HTML 音频的前几秒

    我有一个 React Audio Player 它使用 useAudio 挂钩来管理 HTML5 音频 除了 Mobile Safari 之外 它在任何地方都可以正常工作 在 Mobile Safari 中 声音会在播放器开始播放后几秒钟开
  • 在react中使用useState hook时设置后立即读取组件状态

    This console log不起作用 它只会将之前的状态值打印为set is async const SomeCompo gt const count set useState 0 const setFun gt console log
  • Typescript / 类型安全柯里化函数

    如何在打字稿中安全地输入柯里化函数 特别注意以下示例 interface Prop
  • 通过 Angular 2 中的输入装饰器使用多个属性

    我有一个通过其选择器接收两个输入的组件 但这可以扩展到任意数量的输入和任何组件 因此 为了消耗组件本身的多个属性 Input 装饰器不允许我使用多个属性 因此作为解决方法 我对两个输入属性使用了两个装饰器 但我认为这不是解决这种情况的唯一方
  • 对自定义打字稿错误实例实施instanceof检查?

    打字稿有这个instanceof 检查自定义错误 https github com Microsoft TypeScript issues 13965问题 但尚不清楚我们需要做什么才能得到instanceof在职的 例如对于这个异常我们如何
  • React:React 如何确保在浏览器有机会绘制之后调用 useEffect?

    useLayoutEffect 的文档说 useLayoutEffect 内计划的更新将被刷新 在浏览器有机会绘制之前同步进行 useEffect 的文档说 与 componentDidMount 和 componentDidUpdate
  • Angular 12将json导入到ts中

    我有一个 json 文件src assets version json包含以下内容 VERSION 1 0 0 然后我将文件导入到 ts eg import as VersionInfo from src assets version js
  • Rxjs 可观察等待直到满足某些条件

    我有以下重试逻辑来重试操作 对于单个请求来说它工作得很好 对于多个正在进行的请求 我想在重试之前等待现有的重试逻辑完成 handleError errors Observable

随机推荐

  • AngularJS 外部 ng-repeat 不在内部 ng-repeat 上注册监视

    这与我的问题有关 Angular JS ng repeat 消耗更多浏览器内存 我的问题是我需要嵌套的 ng repeats 并且由于注册了更多的监视 因此嵌套的 ng repeats 会消耗更多的内存 table thead td Id
  • 如何设置 Eclipse 控制台区域设置/语言

    使用 Eclipse Helios 开发 Web 应用程序时 tomcat 输出将发送到控制台 好的 但是这些消息正在被翻译成我的操作系统语言 事实上 我的 Eclipse 是英语的 但 Tomcat 输出 日志记录 正在翻译为葡萄牙语 可
  • 鼠标移动太快而无法捕获事件

    这与 上一个问题 但问题是 只有当我在 TableLayoutPanel 上和周围快速移动鼠标时 我的代码才会失败 由于鼠标快速移动 C 或 Windows 是否有可能报告 触发事件乱序 如果是这样 我该如何纠正 谢谢 我希望这不会被视为重
  • 如何获取jq中过滤数组后的第一个对象?

    给出以下 JSON tags key env value foo key env value bar 我正在尝试找出密钥所在的第一个标签env 我有这个 tags select key env 0 但这给了我一个错误Cannot index
  • TextField - 在用户开始输入文本之前显示提示

    我正在开发一个黑莓应用程序 我想在用户开始输入之前在 TextField 中显示提示文本 当用户开始输入时 它应该消失 当 TextField 中有 0 个字符时 它应该显示 有人实现了这个吗 然后请分享 protected void pa
  • 如何使用 Bicep 部署带有 .Net 堆栈的 Windows Azure 应用服务?

    我创建了一个 Bicep 来部署带有 linux windows 选择和 net 6 堆栈的服务计划和应用服务 两次部署均成功 Linux 应用程序完全正常 门户网站上存在 net 6 堆栈 然而 Windows 堆栈门户屏幕上为空 我正在
  • 如何在VM之外访问安装在Azure VM(VM角色)上的sql服务器?

    我正在处理 Windows Azure VM 角色 我在 Azure VM 上安装了 sql 服务器 现在我想从外部连接到该 sql 服务器 这可能吗 请参考此链接配置您的VM角色 您需要的一部分是打开一个防火墙端口 允许与您的虚拟机角色进
  • 如何以编程方式从draw.io PNG中提取XML数据

    长话短说 我希望能够在浏览器中使用 PHP 或 JavaScript 从 Draw io 保存的 PNG 中提取 XML 数据 我使用带有图层的draw io 图像来记录网络设备之间的物理连接 文档站点是一个内部站点 运行dokuwiki例
  • NSURLSession 取消任务

    我使用以下配置创建新的 NSURLSession if self session NSURLSessionConfiguration config NSURLSessionConfiguration backgroundSessionCon
  • 如何确保 Athena 结果 S3 对象具有存储桶所有者完全控制

    我们 账户 A 希望以编程方式在不同的 aws 账户 账户 B 中触发 athena 查询 startQueryExecution 我们使用假定的角色来实现它 athena 查询完成后 我们期望结果应写入我们的 aws 账户 s3 存储桶
  • 当链接不包含 http 时 android.content.ActivityNotFoundException

    我的应用程序允许用户使用有限的 HTML 向其他用户输入消息 我允许的事情之一是使用超链接 Example a href www google com Google a 我正在填充TextView通过以下方法 txtview setMove
  • Mac OSX 上的 XAMPP:为什么作为“守护进程”运行? [关闭]

    Closed 这个问题不符合堆栈溢出指南 目前不接受答案 我有点困惑 我在 Mac OSX Macbook 上的 XAMPP 中运行 Apache 服务器 我写了一个文件上传脚本并且运行良好 但上传的文件的所有者为 daemon 如何将我或
  • 将可变大小表单转换为 javascript 和 PHP (AJAX)

    背景 我有一个包含一堆按钮的网页 想想 POS 系统 我希望用户能够编辑按钮的名称 用于将它们按特定顺序排列 和按钮的文本 其中包含项目和成本两部分 目前 我通过将数据从 PHP 页面 完成编辑的地方 传递到另一个 PHP 页面 我将其写回
  • C 和它的抽象机之间的精确关系是什么?

    我正在读 C in a nutshell 里面有很多类似的句子 语句指定要执行的一个或多个操作 例如 为变量赋值 将控制权传递给函数 或者 跳到另一个声明 我的问题是 执行 这些动作的东西是什么 我到处读到过 C 被定义为在抽象机器上运行
  • ASP、MySQL 和 UTF-8

    首先 我几乎阅读了所有与此相关的主题 我已经尝试了所有建议 但无法解决这个问题 事情是这样的 我在一个项目中使用经典 ASP 和 MySQL 一切都很好 如果我写 一个例子 Response Write 它就像一个魅力 但是 如果该字符串来
  • MySQL SELECT 计数器、分组依据

    我不确定我所要求的是否可能 但它可能是哈哈 基本上 我有两张桌子 曲目和专辑 我想显示所有曲目的列表并从专辑部分获取名称 这些表看起来像这样 tbl tracks id int auto increment primary key albu
  • 如何获取黑莓当前位置的纬度和经度?

    我正在开发一个具有 GPS 功能的应用程序 如何获取当前位置的纬度和经度 我自己找到了解决方案 以下代码对我来说效果很好 package mypackage import javax microedition location Locati
  • Angularjs 格式日期

    Angular 中是否有任何指令 我想在用户在日期输入中写入 2 3 67 时启用用户 日期需要格式化为 02 03 1967 我自己尝试了一些东西 但它们不起作用 当显示用户输入时 只需添加 Angularjs 格式即可 yourdate
  • AngularJS指令输入宽度通过keyup调整大小

    我创建了一个指令 以便在键入时自动调整宽度的输入 如 Google 联系人 但似乎不行 因为每个字符的宽度不同 您能帮我提供一个更优化的方法吗 谢了 http plnkr co edit DSn0JDDShOXvuXXF9PP2 p pre
  • 除非提供“--jsx”标志,否则无法使用 JSX

    我四处寻找这个问题的解决方案 他们都建议添加 jsx react 到您的 tsconfig json 文件 我已经做到了 另一种是添加 include 我也做过 但是 当我尝试编辑时仍然收到错误 tsx文件 下面是我的 tsconfig 文