React Native and Meteor packages

I am asking here those who already wrote RN apps and how you managed to use code from your Meteor packages. Is this even possible? Do I have to rewrite my libraries as NPM packages or is there any way to “import” at least files from packages somehow (I doubt, but…).

Second, am I right, that I still need a Meteor app as my running “backend”, while the RN app simply works as a client?

Third, has someone implemented loginWith for a RN app?

2 Likes

I have actually managed to create NPM versions of the client side parts of my Socialize packages. Basically it boils down to…

  1. Wrap client side code in a function that takes the Meteor API’s as a parameter and export that function. The function should return any variables that were previously exported.

      //import any regular NPM packages here as they work in both environments
    
      export default ( { Meteor, Mongo } ) => { // Meteor API in as a parameter
        //code that uses the Meteor API
        return { Var1, Var2  };
      }
    
  2. Create an entry point file for both the NPM package and the Meteor package that imports the function, calls it passing the Meteor APIs as a parameter, and then exports the returned variables that you wish to make available from the package.

      // Meteor entry point
      import { Meteor } from 'meteor/meteor';
      import { Mongo } from 'meteor/mongo';
      import clientClosure from './client-module';
    
      const { Var1, Var2 } = clientClosure({Meteor, Mongo});
    
      export { Var1, Var1 }
    

      // NPM entry point
      import Meteor, { Mongo } from '@socialize/react-native-meteor';
      import clientClosure from './client-module';
    
      const { Var1, Var2 } = clientClosure({Meteor, Mongo});
    
      export { Var1, Var1 }
    

If you want to see working examples, all of the socialize packages are using this technique. I’ve used the @socialize/react-native-meteor package here in the example as it’s a bit closer aligned to the actual Meteor API, but the @meteorrn/core package should work for this as well.

2 Likes

Can this similar approach be used for electron apps?
Thanks.

@copleykj thanks a lot for the example :muscle:

So if I got it all right then I need to create a new package.json in my packages and provide the two entry points and publish to npm or link it locally and inject Meteor/Mongo from the react native Meteor core package, right?

One thing I missed though is how it works when the package depends on another Meteor package, like here. How do you link this dependency in RN?

I’ve never actually tried with electron apps but I believe that my @socialize fork should work.

1 Like

You are very welcome of course.

Yes, that is correct.

That’s the one caveat. Any other Meteor packages that your packages depend on would also have to be ported in this same way. The exception is ones that you only rely on for server functionality, as is the case with reywood:publish-composite [there](socialize-messaging/package.js at devel · copleykj/socialize-messaging · GitHub

1 Like