feat: Add React Native Support

- Add a new react-native configuration module, integrating @react-native/eslint-config

- Update the main configuration logic to support React Native options

- Adjust React configuration to filter out DOM-related rules when React Native is enabled

- Update type definitions and exports to include React Native modules

- Add @react-native/eslint-config as a development dependency

- Simplify the team description in the README to general instructions

Author: Simoon-F

README.md

@@ -1,6 +1,6 @@
 # @sj-distributor/eslint-config
 
-The ESLint configuration for the SJ Distributor team, based on the latest ESLint Flat Config (v9+), offering out-of-the-box best practices for React + TypeScript.
+Based on the latest ESLint Flat Config (v9+), offering out-of-the-box best practices for React + TypeScript.
 
 [中文文档](./README_CN.md)
 

README_CN.md

@@ -1,6 +1,6 @@
 # @sj-distributor/eslint-config
 
-SJ Distributor 团队专用的 ESLint 配置，基于最新的 ESLint Flat Config (v9+)，提供开箱即用的 React + TypeScript 最佳实践。
+基于最新的 ESLint Flat Config (v9+)，提供开箱即用的 React + TypeScript 最佳实践。
 
 [English Documentation](./README.md)
 

package.json

@@ -40,6 +40,7 @@
     "typescript-eslint": "^8.56.1"
   },
   "devDependencies": {
+    "@react-native/eslint-config": "^0.84.1",
     "@types/node": "^25.3.0",
     "eslint": "^10.0.2",
     "eslint-typegen": "^2.3.1",

pnpm-lock.yaml

@@ -1,6 +1,7 @@
 export * from './ignores';
 export * from './javascript';
 export * from './react';
+export * from './react-native';
 export * from './stylistic';
 export * from './typescript';
 export * from './unicorn';

src/configs/index.ts

@@ -0,0 +1,61 @@
+import type { TypedFlatConfigItem } from '../types';
+import type { Overrides } from '../types';
+import { interopDefault } from '../utils';
+
+export interface ReactNativeOptions {
+  /**
+   * Files to apply the React Native rules to.
+   * @default ['**\\/*.{js,jsx,mjs,cjs,ts,tsx}']
+   */
+  files?: string[];
+
+  /**
+   * Override React Native rules.
+   */
+  overrides?: Overrides;
+}
+
+export async function reactNative(
+  options: ReactNativeOptions = {},
+): Promise<TypedFlatConfigItem[]> {
+  const {
+    files = ['**/*.{js,jsx,mjs,cjs,ts,tsx}'],
+    overrides = {},
+  } = options;
+
+  try {
+    const rnConfigPath = '@react-native/eslint-config/flat';
+    const [
+      reactNativeConfig,
+    ] = await Promise.all([
+      interopDefault(import(rnConfigPath)),
+    ] as const);
+
+    return [
+      {
+        name: 'sj-distributor/react-native/setup',
+        languageOptions: {
+          globals: {
+            __DEV__: 'readonly',
+          },
+        },
+      },
+      ...(Array.isArray(reactNativeConfig) ? reactNativeConfig : [reactNativeConfig]),
+      {
+        name: 'sj-distributor/react-native/overrides',
+        files,
+        rules: overrides,
+      },
+    ];
+  }
+  catch (error) {
+    if (error instanceof Error && 'code' in error && (error as any).code === 'ERR_MODULE_NOT_FOUND') {
+      throw new Error(
+        'You have enabled React Native support but "@react-native/eslint-config" is not installed.\n'
+        + 'Please install it using your package manager.\n'
+        + 'e.g. pnpm add -D @react-native/eslint-config',
+      );
+    }
+    throw error;
+  }
+}

src/configs/react-native.ts

@@ -15,6 +15,12 @@ export interface ReactOptions {
    */
   typescript?: boolean;
 
+  /**
+   * Enable React Native support.
+   * @default false
+   */
+  reactNative?: boolean;
+
   /**
    * Override React rules.
    */
@@ -27,6 +33,7 @@ export async function react(
   const {
     files = ['**/*.{js,jsx,mjs,cjs,ts,tsx}'],
     typescript = true,
+    reactNative = false,
     overrides = {},
   } = options;
 
@@ -40,20 +47,43 @@ export async function react(
     interopDefault(import('eslint-plugin-react-refresh')),
   ] as const);
 
+  // eslint-disable-next-line ts/no-explicit-any
   const plugins = (pluginReact.configs.all as any).plugins;
 
+  let baseRules = {
+    // recommended rules from @eslint-react/eslint-plugin
+    ...pluginReact.configs.recommended.rules,
+    ...(typescript ? pluginReact.configs['recommended-typescript'].rules : {}),
+  };
+
+  if (reactNative) {
+    // eslint-disable-next-line ts/no-explicit-any
+    const filteredRules: Record<string, any> = {};
+    for (const key of Object.keys(baseRules)) {
+      if (!key.startsWith('@eslint-react/dom/') && !key.startsWith('@eslint-react/web-api/')) {
+        // eslint-disable-next-line ts/no-explicit-any
+        filteredRules[key] = (baseRules as any)[key];
+      }
+    }
+    baseRules = filteredRules;
+  }
+
   return [
     {
       name: 'sj-distributor/react/setup',
       plugins: {
         'react-hooks': pluginReactHooks,
         'react-refresh': pluginReactRefresh,
         '@eslint-react': plugins['@eslint-react'],
-        '@eslint-react/dom': plugins['@eslint-react/dom'],
+        ...(reactNative
+          ? {}
+          : {
+              '@eslint-react/dom': plugins['@eslint-react/dom'],
+              '@eslint-react/web-api': plugins['@eslint-react/web-api'],
+            }),
         '@eslint-react/hooks-extra': plugins['@eslint-react/hooks-extra'],
         '@eslint-react/naming-convention': plugins['@eslint-react/naming-convention'],
         '@eslint-react/rsc': plugins['@eslint-react/rsc'],
-        '@eslint-react/web-api': plugins['@eslint-react/web-api'],
       },
     },
     {
@@ -68,9 +98,7 @@ export async function react(
         sourceType: 'module',
       },
       rules: {
-        // recommended rules from @eslint-react/eslint-plugin
-        ...pluginReact.configs.recommended.rules,
-        ...(typescript ? pluginReact.configs['recommended-typescript'].rules : {}),
+        ...baseRules,
 
         // react-hooks
         ...pluginReactHooks.configs.recommended.rules,

src/configs/react.ts

@@ -1,4 +1,4 @@
-import { ignores, javascript, react, stylistic, typescript, unicorn } from './configs';
+import { ignores, javascript, react, reactNative, stylistic, typescript, unicorn } from './configs';
 import type { AvengerOptions, UserConfig } from './types';
 
 export async function avenger(
@@ -7,6 +7,7 @@ export async function avenger(
 ): Promise<UserConfig[]> {
   const {
     react: enableReact = false,
+    reactNative: enableReactNative = false,
     typescript: enableTypescript = true,
     stylistic: enableStylistic = true,
     unicorn: enableUnicorn = true,
@@ -33,21 +34,30 @@ export async function avenger(
     if (enableTypescript && reactOptions.typescript === undefined) {
       reactOptions.typescript = true;
     }
+    if (enableReactNative && reactOptions.reactNative === undefined) {
+      reactOptions.reactNative = true;
+    }
     configs.push(...(await react(reactOptions)));
   }
 
-  // 5. Stylistic
+  // 5. React Native
+  if (enableReactNative) {
+    const reactNativeOptions = typeof enableReactNative === 'object' ? enableReactNative : {};
+    configs.push(...(await reactNative(reactNativeOptions)));
+  }
+
+  // 6. Stylistic
   if (enableStylistic) {
     const stylisticOptions = typeof enableStylistic === 'object' ? enableStylistic : {};
     configs.push(...stylistic(stylisticOptions));
   }
 
-  // 6. Unicorn
+  // 7. Unicorn
   if (enableUnicorn) {
     configs.push(...unicorn());
   }
 
-  // 7. User overrides
+  // 8. User overrides
   if (userConfigs.length > 0) {
     configs.push(...userConfigs);
   }

src/main.ts

@@ -1,5 +1,6 @@
 import type { Linter } from 'eslint';
 import type { ReactOptions } from './configs/react';
+import type { ReactNativeOptions } from './configs/react-native';
 import type { StylisticOptions } from './configs/stylistic';
 import type { RuleOptions } from './typegen';
 
@@ -36,6 +37,12 @@ export interface AvengerOptions {
    */
   react?: boolean | ReactOptions;
 
+  /**
+   * Enable React Native support.
+   * @default false
+   */
+  reactNative?: boolean | ReactNativeOptions;
+
   /**
    * Enable TypeScript support.
    * @default true