packaging in React Native

[mvayngrib]

"browser" in package.json is too restrictive for environments like react-native, where there is a lot more functionality available. For example, in our project (tradle), we're currently manually changing webtorrent's package.json to allow fs-storage and bittorrent-dht use.

browserify and react-native packager don't currently support the alt browser field (see "chromeapp"), but this would be a great module to lead the way to its support. It'll also be a good way to get a foothold in the React Native community.

I'm proposing to add another mapping to package.json alongside "browser":

"browser": {
  "./lib/fs-storage": false,
  "./lib/server": false,
  "bittorrent-dht/client": false,
  "load-ip-set": false,
  "ut_pex": false
}, 
"react-native": {
// all of the above can probably work in React Native
// though fs-storage will need to lose the fs.existsSync line
}

If this sounds interesting, I can add similar blocks to bittorrent-dht, etc, which can benefit from react-native-udp and react-native-level-fs and other node core shims coming.

[feross]

Have you had any luck using browserify -r udp:react-native-udp script.js to replace all places where udp is required? Or does the "browser" field take precedence here?

I also want to make a chrome extension/app version of webtorrent, and this problem will be important to figure out.

[mvayngrib]

browserify+react-native is not easy today because react native's internal packages break the great laws of require() in the name of brevity. They are moving towards compatibility, and there are hybrid solutions: react-native-webpack-server, which works pretty well with webpack+react-native packager, and react-native-browserify-server, which I adapted from the webpack one, but which is reaaaaallly slow. Basically they split up the work between browserify/webpack and the react-native packager. There may be one or two others.

Re: chromeapp, when we were running in that env, we were also stuck with hacking package.json or configuring browserify. I'd rather see more explicit mappings in package.json though. The "browser" field is a good and widely accepted fallback for a non-desktop environment, but that's really what it is - a fallback. If you are able to make a more env-specific mapping - chromeapp, react-native, firefox app, etc., you should be able to.

[vespakoen]

Working on supporting this natively: facebookarchive/node-haste#46

[feross]

Cool, will close this issue here.

[lock]

This thread has been automatically locked because it has not had recent activity. To discuss futher, please open a new issue.