0

I’m working on an application with two very different incarnations:

  • a React Native app that includes certain processing services because offline use is mandatory
  • a React Native Web app in which these services are accessed via an Express API for better security and performance

For the RN app, my code is something like this:

import summarize from '../services/summarize';
const response = summarize({ factors })

For the RNW app, it's:

const response = axios.put(`${ROOT_URL}/summarize`, { factors });

What's a clean way to handle such different code? I'm currently commenting/uncommenting one version or the other depending on my build target, but there must be better ways.

ed94133
  • 1,477
  • 2
  • 19
  • 40
  • `Platform.OS === 'web'` https://reactnative.dev/docs/platform-specific-code – Ugur Eren Jun 03 '21 at 13:50
  • Well, in the RNW version I won't even import summarize, so I'll get an error if there's any code that references it. – ed94133 Jun 03 '21 at 13:53
  • Well, then you can use platform specific file extension (like .web.js) or conditional imports with require or import() syntax https://stackoverflow.com/a/50341763/5793132 – Ugur Eren Jun 03 '21 at 13:58
  • 1
    I didn't know about platform-specific file extensions. That'll work great for me. Feel free to make that the answer and I'll accept it. – ed94133 Jun 04 '21 at 12:57

0 Answers0