一、创建react native项目
pnpm create expo-app --template default@sdk-57具体参见Expo官网
二、安装prettier和eslint相关依赖
安装prettier相关依赖
pnpm add prettier eslint-config-prettier eslint-plugin-prettier @ianvs/prettier-plugin-sort-imports prettier-plugin-sort-json eslint-plugin-unused-imports prettier-plugin-tailwindcss -D安装eslint相关依赖
pnpm add -D eslint eslint-config-expo| 包 | 作用 |
| eslint | 检查代码问题 |
| eslint-config-expo | Expo/RN/TS 官方规则集 |
| prettier | 格式化 |
| eslint-config-prettier | 关掉和 Prettier 冲突的 ESLint 规则 |
| eslint-plugin-prettier | 把 Prettier 问题当 ESLint 报错 |
可选（你用了 NativeWind/Tailwind）：
pnpm add -D prettier-plugin-tailwindcss三、配置文件
1、eslint.config.js`（项目根目录，Flat Config）
// https://docs.expo.dev/guides/using-eslint/ const { defineConfig } = require('eslint/config'); const expoConfig = require('eslint-config-expo/flat'); const prettierConfig = require('eslint-config-prettier'); const eslintPluginPrettierRecommended = require('eslint-plugin-prettier/recommended'); const unusedImports = require('eslint-plugin-unused-imports'); const prettierOptions = require('./prettier.config.js'); module.exports = defineConfig([ expoConfig, prettierConfig, eslintPluginPrettierRecommended, { plugins: { 'unused-imports': unusedImports, }, rules: { '@typescript-eslint/no-unused-vars': 'off', 'no-unused-vars': 'off', 'unused-imports/no-unused-imports': 'error', 'unused-imports/no-unused-vars': [ 'warn', { vars: 'all', varsIgnorePattern: '^_', args: 'after-used', argsIgnorePattern: '^_', }, ], // 显式传入同一份 Prettier 配置，避免编辑器缓存旧 .prettierrc 导致排序打架 'prettier/prettier': ['error', prettierOptions], }, }, { ignores: ['dist/*', 'android/*', 'ios/*', '.expo/*'], }, ]);2、创建prettier.config.js
选用json文件若装了 `prettier-plugin-tailwindcss`：
/** @type {import('prettier').Config} */ module.exports = { semi: true, singleQuote: true, trailingComma: 'all', printWidth: 100, tabWidth: 2, endOfLine: 'lf', singleAttributePerLine: true, // require.resolve: ESLint / pnpm 下也能稳定加载插件 plugins: [ require.resolve('@ianvs/prettier-plugin-sort-imports'), require.resolve('prettier-plugin-sort-json'), require.resolve('prettier-plugin-tailwindcss'), ], importOrder: [ '^(react/(.*)$)|^(react$)', '^(expo(.*)$)|^(expo$)', '<THIRD_PARTY_MODULES>', '', '^@/(.*)$', '^[./]', ], importOrderParserPlugins: ['typescript', 'jsx'], importOrderTypeScriptVersion: '5.0.0', };3、 prettier忽略文件 .prettierignore
node_modules dist android ios .expo pnpm-lock.yaml *.lock可选：`.eslintignore` 在 Flat Config 下一般用 `ignores` 即可，可不单独建。
注释
完成以上配置以后，有时候会出现代码不规范编辑器不爆出红色的现象。这不是编辑器设置的问题，是 ESLint 本身崩了，所以红线出不来。
根本原因：项目装的是 ESLint 10.7.0，而
eslint-config-expo依赖的eslint-plugin-react还不支持 ESLint 10
解决办法： 把 ESLint 钉在 9.x（eslint-config-expo开发用的也是^9.18.0）：
pnpm add -D eslint@^9我目前安装的eslint是^9.39.5
四、文件清单小结
| 文件 | 是否需要 |
| eslint.config.js | ✅ 需要 |
| .prettierignore | ✅ 需要 |
| .prettierrc | ✅ 建议有 |
| .eslintrc.js | ❌ SDK 57 用 Flat，不必再加 |
五、最快上手
npx expo lint npx expo install --dev prettier eslint-config-prettier eslint-plugin-prettier然后按上面写好 `eslint.config.js` 和 `.prettierrc`，再跑：
```bash
pnpm lint
```
