如何在 JavaScript 文件（.js 扩展名）中禁止 JSX 语法答案

【问题标题】：How to disallow JSX syntax in JavaScript files (.js extension)如何在 JavaScript 文件（.js 扩展名）中禁止 JSX 语法
【发布时间】：2018-07-18 09:43:04
【问题描述】：

我想确保 VS Code 中的 JavaScript 文件（扩展名为 js）仅包含有效的 JavaScript 语法。

是否可以在 VS Code 中禁止 .js 文件的 JSX 语法？

当然，理想情况下，我仍然希望 .jsx 文件使用 JSX 语法。

【问题讨论】：

“不允许”具体是什么意思？您是在谈论不显示语法突出显示，这可能是您在 IDE 中配置的内容，还是实际上有警告/错误，这似乎更像是您的 linting 或构建过程的责任？
JSX 语法通常出现在 render 函数中应该会产生错误，因为它不是有效的 JavaScript。
来自...的错误是什么？您是否使用 linting，是否配置正确？您的构建步骤是否拒绝它？您还没有真正阐明您希望 VSCode 扮演什么角色。
JSX 语法应该像任何无效的 JavaScript 代码一样用红色下划线。我没有问题，我只想在 JavaScript 文件包含无效的 JavaScript 语法时在编辑器中收到警告。
@jonrsharpe 要清楚我不是在谈论执行时间，只是在编辑器中的提示。如果系统为 JSX 正确配置，它应该执行。但除非我在项目中明确允许它，否则我希望 VS Code 提醒我 JSX 语法不是有效的 JavaScript（在 .js 文件中）。

标签： javascript visual-studio-code jsx

【解决方案1】：

您可以使用eslint-plugin-react 的react/jsx-filename-extension rule。

默认情况下，它只允许在 *.jsx 文件中使用 JSX，因此当它在不应该出现的文件中检测到 JSX 时，您将收到错误/警告（取决于您的配置方式）。

【讨论】：