为何VSCode的Linter在JS文件含JSX代码时不提示错误？

这是VSCode内置能力 + Create React App隐性配置共同作用的结果，核心原因有三点：

• VSCode原生支持React/JSX语法：无需额外安装插件，VSCode内置的TypeScript Language Service（即便项目用纯JS也会生效）会自动读取项目package.json里的react依赖，据此开启JSX的语法高亮、错误校验和智能提示。

• 基于代码内容的语法推断：当.js文件里出现React组件写法（比如返回类HTML结构的代码），或是存在React相关导入（React 17+后CRA支持自动注入JSX所需的React，哪怕代码里没显式写import React），VSCode会自动把该文件标记为「React JSX文件」，而非普通JavaScript文件，自然不会把JSX判定为语法错误。

• Create React App的隐性配置传递：CRA生成的项目虽不在根目录显示.eslintrc或tsconfig.json，但在node_modules中内置了全套预设配置（比如eslint-config-react-app），VSCode会自动读取这些配置，识别到项目需要支持JSX语法，因此不会报错。

你提供的示例代码（格式化后）：

// App.js
import logo from './logo.svg';
import './App.css';

function App() {
  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Edit <code>src/App.js</code> and save to reload.
        </p>
        <a
          className="App-link"
          href="https://reactjs.org"
          target="_blank"
          rel="noopener noreferrer"
        >
          Learn React
        </a>
      </header>
    </div>
  );
}

export default App;

内容的提问来源于stack exchange，提问作者vktop