Using SDK in a React native project

[CarlosUtrilla]

Problem Description When using the Nestia SDK in a React Native project, an error related to dynamic import has been encountered, producing the following message:

../../node_modules/import2/index.js: Invalid call at line 3: import(path).

This error seems to be related to the @nestia/fetcher

Attempted Solutions Setting fetch to fetch option on Iconnection

{
   ...connection,
    fetch: fetch
}

Any proposal to solve this issue, please?

P.S: Sorry for my bad english

[samchon]

https://github.com/samchon/nestia/blob/master/packages/fetcher/src/internal/FetcherBase.ts#L138-L140

https://github.com/samchon/nestia/blob/master/packages/fetcher/src/internal/FetcherBase.ts#L199-L215

As I've not developed React Native at all, I don't know how to solve this problem.

Here is the fetch() function used in @nestia/e2e. Can you fix the code through PR?

[CarlosUtrilla]

I had to clone the fetcher project and add it to my monorepo packages. I deleted the code fragmen where it uses import2.

From this

const polyfill = new Singleton(async (): Promise<typeof fetch> => {
  function is_node_process(m: typeof global | null): boolean {
    return (
      m !== null &&
      typeof m.process === "object" &&
      m.process !== null &&
      typeof m.process.versions === "object" &&
      m.process.versions !== null &&
      typeof m.process.versions.node !== "undefined"
    );
  }
  if (typeof global === "object" && is_node_process(global)) {
    const m: any = global as any;
    m.fetch ??= ((await import2("node-fetch")) as any).default;
    return (m as any).fetch;
  }
  return self.fetch;
});

To this

const polyfill = new Singleton(async (): Promise<typeof fetch> => {
  function is_node_process(m: typeof global | null): 
  return self.fetch;
});

This solved my problem, but having it cloned means I would have to manually perform updates each time. Perhaps the issue lies in checking if it's a node_process.

Would a solution based on this be useful for implementing any fixes?

[samchon]

Since Node v20, fetch becomes built-in function.

If the node_process checking logic occures the problem, how about removing the polyfill logic and using the built-in fetch function directly? In that case, nestia will no more support NodeJS v20 under versions.

[CarlosUtrilla]

It's a good proposal, but that would be a breaking change for projects using a version lower than v20. I'll leave it up to your discretion.

[samchon]

Then globalThis works in the ReactNative? Instead of global, using globalThis will be another option.

[samchon]

In that case, the polyfill code would be like below:

const polyfill = new Singleton(async (): Promise<typeof fetch> => {
  const m: typeof globalThis | null = (() => {
    if (typeof globalThis === "object") return globalThis;
    else if (typeof global === "object") return global;
    else if (typeof window === "object") return window;
    else if (typeof self === "object") return self;
    throw new Error("Unknown platform. No global object found.");
  })();
  m.fetch ??= ((await import2("node-fetch")) as any).default;
  return m.fetch;
});

[CarlosUtrilla]

Okay, let me verify if this solution works and I'll confirm with you to proceed with a PR

[samchon]

@CarlosUtrilla You can test it on the next version: 3.2.6-dev.20240624.

# BY NEXT TAG
npm install @nestia/fetcher@next

# OR DIRECT VERSIONING
npm install @nestia/fetcher@3.2.6-dev.20240624

[CarlosUtrilla]

I tried it and it doesn't work, maybe for the reason mentioned here: https://stackoverflow.com/a/60562613

So I think the best solution is to implement the first option.

.... In that case, nestia will no more support NodeJS v20 under versions.

[samchon]

Then I'll publish the Node v20 option as v3.3 update.

It would be published when ts-patch fixes this issue: https://github.com/nonara/ts-patch/issues/159

[CarlosUtrilla]

Okay, I look forward to it. Thank you very much for the support.