microsoft / rnx-kit

Modern, scalable tools. Exceptional developer experience.
https://microsoft.github.io/rnx-kit/
MIT License
1.46k stars 94 forks source link

I have many react-native bundles,So I split bundles to little bundle.But When I use @rnx-kit/metro-serializer-esbuild to build esmodule-bundles,i found split bundle now work #3215

Open Hao-yiwen opened 6 days ago

Hao-yiwen commented 6 days ago

What happened?

issue example

https://github.com/Hao-yiwen/reactNative-study/tree/master/splitRn_0736

Affected Package

@rnx-kit/metro-serializer-esbuild

Version

0.1.35

Which platforms are you seeing this issue on?

System Information

System:
  OS: macOS 14.2.1
  CPU: (8) arm64 Apple M2
  Memory: 65.42 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 18.12.1
    path: ~/.nvm/versions/node/v18.12.1/bin/node
  Yarn:
    version: 1.22.22
    path: ~/.nvm/versions/node/v18.12.1/bin/yarn
  npm:
    version: 8.19.2
    path: ~/.nvm/versions/node/v18.12.1/bin/npm
  Watchman:
    version: 2024.05.06.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.10.1
    path: /Users/yw.hao/.rbenv/shims/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 23.0
      - iOS 17.0
      - macOS 14.0
      - tvOS 17.0
      - watchOS 10.0
  Android SDK: Not Found
IDEs:
  Android Studio: 2023.2 AI-232.10300.40.2321.11567975
  Xcode:
    version: 15.0.1/15A507
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.9
    path: /usr/bin/javac
  Ruby:
    version: 3.0.0
    path: /Users/yw.hao/.rbenv/shims/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.2.0
    wanted: 18.2.0
  react-native:
    installed: 0.73.6
    wanted: 0.73.6
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: Not found
  newArchEnabled: false

Steps to Reproduce

Restoration steps

  1. npm run build:common to build common bundle.
  2. npm run build:indexto build main bundle.(main bundle use common mapping.json)

Code of Conduct

Hao-yiwen commented 6 days ago
  1. Build common bundle get follow json. 截屏2024-07-04 19 16 19

2.But common.json can't use in main.jsbundle.

Hao-yiwen commented 6 days ago

Follow is my main.jsbundle metro.config.

const {hasBuildInfo, getCacheFile, isPwdFile} = require('./build');
const bundleBuInfo = require('./config/bundleBuInfo.json');
function postProcessModulesFilter(module) {
  if (
    module['path'].indexOf('__prelude__') >= 0 ||
    module['path'].indexOf('polyfills') >= 0
  ) {
    return false;
  }

  if (hasBuildInfo('/Users/yw.hao/Documents/rn/reactNative-study/splitRn_0736/config/bundleCommonInfo.json', module.path)) {
    return false;
  }

  return true;
}

function createModuleIdFactory() {
  const fileToIdMap = new Map();
  let nextId = 10000000;
  let isFirst = false;

  return path => {
    if (Boolean(getCacheFile('./config/bundleCommonInfo.json', path))) {
      return getCacheFile('./config/bundleCommonInfo.json', path);
    }

    if (!isFirst && isPwdFile(path)) {
      nextId = bundleBuInfo[isPwdFile(path)];
      isFirst = true;
    }

    let id = fileToIdMap.get(path);
    if (typeof id !== 'number') {
      id = nextId++;
      fileToIdMap.set(path, id);
    }
    return id;
  };
}

const {getDefaultConfig, mergeConfig} = require('@react-native/metro-config');

const {
  MetroSerializer,
  esbuildTransformerConfig,
} = require('@rnx-kit/metro-serializer-esbuild');

/**
 * Metro configuration
 * https://facebook.github.io/metro/docs/configuration
 *
 * @type {import('metro-config').MetroConfig}
 */
const config = {
  serializer: {
    createModuleIdFactory: createModuleIdFactory,
    processModuleFilter: postProcessModulesFilter, 
    customSerializer: MetroSerializer(),
  },
  transformer: esbuildTransformerConfig,
};

module.exports = mergeConfig(getDefaultConfig(__dirname), config);

I found processModuleFilter was override by ()=>true.And because use customSerializer: MetroSerializer() lead to module build don't use number id to identity module.

Hao-yiwen commented 6 days ago

So @rnx-kit/metro-serializer-esbuild can't be used in my Scenes? And only can be use in one bundle?