Platform-specific file extensions

[GuilleDF]

Hi all! We're building a cross-platform library for react and react-native, bundled with tsup. Everything's working fine, but we started adding platform-specific code with the .web.ts and .native.ts extensions, and tsup isn't picking it up. Is there a way to make tsup know about the extensions? My initial idea was to create 2 platform-specific bundles, but this doesn't seem to be possible. Something like this:

export default defineConfig([
  // Web bundle
  {
    entry: ["src/index.ts"],
    // This option doesn't actually exist
    extensions: [".web.ts", ".web.tsx", ".ts", ".tsx"],
  },
  // Native bundle
  {
    entry: ["src/index.ts"],
    // This option doesn't actually exist
    extensions: [".native.ts", ".native.tsx", ".ts", ".tsx"],
  },
]):

Any ideas on how this could be done?

[GuilleDF]

Figured it out! You can set the extensions through the esbuildOptions config:

export default defineConfig([
  // Web bundle
  {
    entry: ["src/index.ts"],
    outDir: 'dist/web',
    esbuildOptions(options) {
      options.resolveExtensions = [".web.ts", ".web.tsx", ".ts", ".tsx"];
    },
  },
  // Native bundle
  {
    entry: ["src/index.ts"],
    esbuildOptions(options) {
      options.resolveExtensions = [".native.ts", ".native.tsx", ".ts", ".tsx"];
    },
  },
]):