PhpStorm原生支持React语法高亮，关键在于将JavaScript语言版本设为React JSX、绑定.jsx/.tsx文件类型，并启用JavaScript and TypeScript及JavaScript Debugger插件，而非依赖第三方高亮插件。
PhpStorm 原生支持 React 语法高亮，不需要额外安装第三方“高亮插件”——所谓“React 高亮”本质是语言模式切换 + 类型定义 + 文件类型绑定的组合结果，装错插件反而会干扰。
为什么 React JSX 模式比插件更重要
PhpStorm 的 JSX 高亮不是靠某个独立插件驱动的，而是由内置的 JavaScript 语言服务在 React JSX 模式下解析 AST 实现的。一旦你把项目语言版本设为 React JSX，且文件后缀（.jsx、.tsx）已注册到对应文件类型，<div>、className、useEffect 就会自动着色和补全。
- 错误现象：输入
use没提示 → 很可能JavaScript and TypeScript插件被禁用，而不是缺“React 插件” - 错误现象：
.jsx文件右下角显示Text或JavaScript→ 文件类型未绑定，高亮直接失效 - 关键路径：Settings → Languages & Frameworks → JavaScript →
JavaScript language version必须选React JSX
react-templates 和 jscs 是过时配置
网上流传的“安装 react-templates 插件开启 JSX 支持”是 2016 年的老方案，该插件早已停止维护，且与现代 PhpStorm（2023.3+）的 React 支持机制冲突。启用它可能导致：
-
useState补全重复出现或跳转错乱 - TSX 文件中
React.FC类型推导失败 - 与 Vite 模板生成的
tsconfig.json冲突，报Cannot resolve symbol React
当前官方推荐路径是：启用 JavaScript and TypeScript + JavaScript Debugger（二者默认启用），再配合 Vite 模板新建项目。
立即学习“PHP免费学习笔记（深入）”；
真正需要检查的三个插件状态
打开 Settings → Plugins，确认以下三项均为 Enabled：
-
JavaScript and TypeScript（核心语言服务，必须） -
JavaScript Debugger（影响 props 提示、断点、Hook 调试） -
Vite（非必须但强烈建议，用于自动识别vite.config.ts和热更新配置）
注意：React 插件本身在新版 PhpStorm 中已不再单独列出——它的能力已合并进上述两个插件中。如果看到独立的 React 插件，说明你用的是非常旧的 PhpStorm 版本（
高亮失效时，优先查这三件事
别急着搜插件，先快速验证基础链路是否打通：
- 右下角状态栏是否显示
React JSX？不是JavaScript React（旧命名）、也不是Text - Settings → Editor → File Types → React JSX 下，是否已添加
*.jsx和*.tsx？漏掉就等于没注册文件 - 项目里有没有
node_modules/react？用 pnpm/yarn PnP 的话，需在 Settings → Languages & Frameworks → Node.js and NPM 中手动指定node_modules路径
复杂点在于：PhpStorm 对 JSX 的解析依赖完整类型上下文，@types/react 缺失时，useState 可能只高亮不提示返回值类型；而 tsconfig.json 里若没设 "jsx": "react-jsx"，TSX 文件的 JSX 片段甚至会被标红——这些都不是插件能绕过的。
