在chrome devtools中,在我所有的tsx源文件中,语法突出显示和智能感知不再起作用

Fli*_*ion 15 google-chrome-devtools typescript tsx

对于具有.tsx扩展名的文件,调试功能对我而言不再起作用。

调试.ts文件时,它正常工作: 在此处输入图片说明

源地图从其仍在工作时就保持不变。但是.tsx文件现在看起来是这样的。所有代码都是黑色的,而不是样式化的,以指示关键字/字符串等之间的差异。而且,在调试(确实有效)时,我无法将变量悬停以查看其值。

在此处输入图片说明

任何想法如何解决这个问题?

编辑:我曾经通过发送内容类型标头解决此问题,如下面的答案所述。但是,即使我在新标签页中打开源文件时,问题又回到了现在,我可以看到Content-Type为“ application / javaScript”

Fli*_*ion 4

终于设法解决了这个问题。

如本问题所述,如果您手动让网络服务器返回 tsx 文件的正确 mime 类型,chrome 会用颜色显示它们并允许再次进行正确的调试。

对我来说,对于 Apache 服务器,我将其包含在 httpd.conf 中

AddType application/javascript .tsx