feat(core): add resolver config

BREAKING CHANGES: Config.mainFields moved to Config.resolver.mainFields

- add resolver config
- update document

docs/docs/configuration/basic-configuration.md

@@ -22,11 +22,13 @@ By default, follow the configuration below.
 ```js
 exports.default = {
   cache: true,
-  mainFields: ['react-native', 'browser', 'main', 'module'],
   logger: {
     disabled: false,
     timestamp: null,
   },
+  resolver: {
+    mainFields: ['react-native', 'browser', 'main', 'module'],
+  },
   transformer: {
     stripFlowPackageNames: ['react-native'],
   },
@@ -42,25 +44,19 @@ Enable cache.
 
 Defaults to `true`
 
-### mainFields
-
-Field names for resolve package's modules.
-
-Defaults to `['react-native', 'browser', 'main', 'module']`
-
-### plugins
-
-Additional Esbuild plugins.
-
-For more details, go to [Custom Plugins](/configuration/custom-plugins)
-
 ### logger
 
 Logger configurations.
 
 - `logger.disabled`: Disable client log (Defaults to `false`)
 - `logger.timestamp`: Print timestamp with log when format is specified (Defaults to `null`)
 
+### resolver
+
+Resolver configurations.
+
+- `resolver.mainFields`: When importing from an npm package, this option will determine which fields in its `package.json` are checked.
+
 ### transformer
 
 Transformer configurations.
@@ -80,6 +76,12 @@ Web configurations.
 
 For more details, go to [Web Support](/web).
 
+### plugins
+
+Additional Esbuild plugins.
+
+For more details, go to [Custom Plugins](/configuration/custom-plugins)
+
 ## Types
 
 <details><summary>Config</summary>
@@ -92,16 +94,6 @@ interface Config {
    * Defaults to `true`
    */
   cache?: boolean;
-  /**
-   * Field names for resolve package's modules.
-   *
-   * Defaults to `['react-native', 'browser', 'main', 'module']`
-   */
-  mainFields?: string[];
-  /**
-   * Additional Esbuild plugins.
-   */
-  plugins?: EsbuildPlugin[];
   /**
    * Logger configurations
    */
@@ -119,6 +111,17 @@ interface Config {
      */
     timestamp?: string | null;
   };
+  /**
+   * Resolver configurations
+   */
+  resolver?: {
+    /**
+     * Field names for resolve package's modules.
+     *
+     * Defaults to `['react-native', 'browser', 'main', 'module']`
+     */
+    mainFields?: string[];
+  };
   /**
    * Transformer configurations
    */
@@ -185,6 +188,10 @@ interface Config {
      */
     placeholders?: Record<string, string>;
   };
+  /**
+   * Additional Esbuild plugins.
+   */
+  plugins?: EsbuildPlugin[];
   /**
    * Client event receiver
    */

package.json

@@ -21,6 +21,7 @@
     "@commitlint/cli": "^17.7.1",
     "@commitlint/config-conventional": "^17.7.0",
     "@faker-js/faker": "^8.1.0",
+    "@types/invariant": "^2.2.36",
     "@types/jest": "^29.5.5",
     "@types/node": "^20.6.2",
     "@vercel/style-guide": "^5.0.1",

packages/core/lib/bundler/bundler.ts

@@ -4,6 +4,7 @@ import esbuild, {
   type BuildResult,
   type ServeResult,
 } from 'esbuild';
+import invariant from 'invariant';
 import { getGlobalVariables } from '@react-native-esbuild/internal';
 import {
   setEnvironment,
@@ -66,11 +67,17 @@ export class ReactNativeEsbuildBundler extends BundlerEventEmitter {
     config.logger?.disabled ?? false ? Logger.disable() : Logger.enable();
     Logger.setTimestampFormat(config.logger?.timestamp ?? null);
 
-    if (!config.mainFields?.includes('react-native')) {
-      logger.warn('`react-native` not found in `mainFields`');
+    invariant(
+      config.resolver?.mainFields,
+      'resolver configuration is required',
+    );
+    invariant(config.transformer, 'transformer configuration is required');
+
+    if (!config.resolver.mainFields.includes('react-native')) {
+      logger.warn('`react-native` not found in `resolver.mainFields`');
     }
 
-    if (!config.transformer?.stripFlowPackageNames?.includes('react-native')) {
+    if (!config.transformer.stripFlowPackageNames?.includes('react-native')) {
       logger.warn('`react-native` not found in `stripFlowPackageNames`');
     }
   }
@@ -146,6 +153,10 @@ export class ReactNativeEsbuildBundler extends BundlerEventEmitter {
     bundleOptions: BundleOptions,
     additionalData?: BundlerAdditionalData,
   ): Promise<BuildOptions> {
+    invariant(this.config.resolver, 'resolver configuration is required');
+    invariant(this.config.resolver.mainFields, 'invalid resolver.mainFields');
+    invariant(this.config.transformer, 'transformer configuration is required');
+
     setEnvironment(bundleOptions.dev);
 
     const webSpecifiedOptions =
@@ -190,7 +201,7 @@ export class ReactNativeEsbuildBundler extends BundlerEventEmitter {
       entryPoints: [bundleOptions.entry],
       outfile: bundleOptions.outfile,
       sourceRoot: path.dirname(bundleOptions.entry),
-      mainFields: this.config.mainFields,
+      mainFields: this.config.resolver.mainFields,
       resolveExtensions: getResolveExtensionsOption(bundleOptions),
       loader: getLoaderOption(),
       define: getGlobalVariables(bundleOptions),

packages/core/lib/bundler/helpers/config.ts

@@ -13,15 +13,17 @@ export const loadConfig = (configFilePath?: string): Config => {
   // Base config
   const baseConfig: Config = {
     cache: true,
-    /**
-     * mainFields
-     * @see {@link https://github.com/facebook/metro/blob/0.72.x/docs/Configuration.md#resolvermainfields}
-     */
-    mainFields: ['react-native', 'browser', 'main', 'module'],
     logger: {
       disabled: false,
       timestamp: null,
     },
+    resolver: {
+      /**
+       * mainFields
+       * @see {@link https://github.com/facebook/metro/blob/0.72.x/docs/Configuration.md#resolvermainfields}
+       */
+      mainFields: ['react-native', 'browser', 'main', 'module'],
+    },
     transformer: {
       stripFlowPackageNames: ['react-native'],
     },

packages/core/lib/types.ts

@@ -11,16 +11,6 @@ export interface Config {
    * Defaults to `true`
    */
   cache?: boolean;
-  /**
-   * Field names for resolve package's modules.
-   *
-   * Defaults to `['react-native', 'browser', 'main', 'module']`
-   */
-  mainFields?: string[];
-  /**
-   * Additional Esbuild plugins.
-   */
-  plugins?: Plugin[];
   /**
    * Logger configurations
    */
@@ -38,6 +28,17 @@ export interface Config {
      */
     timestamp?: string | null;
   };
+  /**
+   * Resolver configurations
+   */
+  resolver?: {
+    /**
+     * Field names for resolve package's modules.
+     *
+     * Defaults to `['react-native', 'browser', 'main', 'module']`
+     */
+    mainFields?: string[];
+  };
   /**
    * Transformer configurations
    */
@@ -105,6 +106,10 @@ export interface Config {
      */
     placeholders?: Record<string, string>;
   };
+  /**
+   * Additional Esbuild plugins.
+   */
+  plugins?: Plugin[];
   /**
    * Client event receiver (only work on native)
    */

packages/core/package.json

@@ -44,6 +44,7 @@
     "chokidar": "^3.5.3",
     "deepmerge": "^4.3.1",
     "esbuild": "^0.19.5",
+    "invariant": "^2.2.4",
     "md5": "^2.3.0",
     "ora": "^5.4.1"
   },

yarn.lock

@@ -4907,6 +4907,7 @@ __metadata:
     chokidar: ^3.5.3
     deepmerge: ^4.3.1
     esbuild: ^0.19.5
+    invariant: ^2.2.4
     md5: ^2.3.0
     ora: ^5.4.1
   peerDependencies:
@@ -5983,6 +5984,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/invariant@npm:^2.2.36":
+  version: 2.2.36
+  resolution: "@types/invariant@npm:2.2.36"
+  checksum: 8f9855a5da7aeef0292bda3ef14ce1d893059e2f70934d870d5533744c789fb4087035dc2e510ffa036d89890812d8170fb1a0e241991cc15e0ffccfaf7d9c13
+  languageName: node
+  linkType: hard
+
 "@types/istanbul-lib-coverage@npm:*, @types/istanbul-lib-coverage@npm:^2.0.0, @types/istanbul-lib-coverage@npm:^2.0.1":
   version: 2.0.4
   resolution: "@types/istanbul-lib-coverage@npm:2.0.4"
@@ -19141,6 +19149,7 @@ __metadata:
     "@commitlint/cli": ^17.7.1
     "@commitlint/config-conventional": ^17.7.0
     "@faker-js/faker": ^8.1.0
+    "@types/invariant": ^2.2.36
     "@types/jest": ^29.5.5
     "@types/node": ^20.6.2
     "@vercel/style-guide": ^5.0.1