求助：Windows10的VSCode中如何让ESLint适配create-react-native-app？

我之前在Windows 10上用VSCode开发RN项目时，碰到过几乎一模一样的问题——新版npm和create-react-native-app的依赖兼容性确实坑，转用yarn后又冒出一堆小状况。下面是我亲测有效的解决办法，分点给你梳理：

1. VSCode内终端无法生成RN项目二维码？试试这几招 #

VSCode内置终端有时候会因为权限或环境变量限制，导致metro bundler没法正常输出二维码，外部CMD反而能正常运行，这时候可以这么操作：

• 右键点击VSCode图标，选择以管理员身份运行，再打开终端执行yarn创建命令，权限不足经常是这类问题的元凶
• 检查VSCode默认终端：按Ctrl+,打开设置，搜索terminal.integrated.defaultProfile.windows，把默认shell改成Command Prompt——PowerShell的执行策略有时候会限制RN脚本运行，换CMD大概率能解决
• 如果还是没出现二维码，进入项目根目录手动执行yarn start启动metro服务，一般这时候就能正常弹出二维码了

2. yarn安装ESLint+Airbnb规则失败？修复依赖解析问题 #

yarn和npm的依赖树解析逻辑不同，Airbnb的规则包有大量嵌套依赖，很容易因为版本冲突或缓存问题安装失败，试试这些步骤：

• 先清空yarn缓存：执行yarn cache clean，避免缓存里的损坏依赖干扰安装
• 手动指定兼容版本：在项目根目录新建.yarnrc文件，添加以下RN项目常用的兼容版本配置：

  "@babel/eslint-parser" "^7.22.0"
  "eslint-config-airbnb" "^19.0.4"
  "eslint-plugin-import" "^2.28.0"
  "eslint-plugin-react" "^7.33.0"
  

• 重新执行安装命令：yarn add eslint eslint-config-airbnb eslint-plugin-react eslint-plugin-import eslint-plugin-jsx-a11y --dev，要是还失败，直接删掉node_modules和yarn.lock，再重新跑安装命令
• 另外，RN项目的ESLint需要适配RN环境，记得在.eslintrc.js里把extends改成['airbnb', 'plugin:react-native/all']，同时安装eslint-plugin-react-native（yarn add eslint-plugin-react-native --dev），不然规则冲突会导致ESLint表现不稳定

3. 让ESLint稳定运行的通用技巧 #

• VSCode安装ESLint插件后，打开设置搜索eslint.packageManager，将其设为yarn，这样插件会用项目本地的yarn依赖解析ESLint，避免和全局npm依赖混淆
• 暂时关掉ESLint的自动修复功能（如果开启的话），RN项目的部分文件结构会触发不必要的自动修复，导致编辑器卡顿，手动执行yarn lint检查代码反而更稳定
• 不要混用全局和本地的ESLint，所有ESLint相关依赖都用--dev安装在项目本地，全局ESLint很容易和项目依赖版本不兼容，引发不稳定问题

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