Meteor & react break down a Meteor app into local packages targeting both mobile app and web

I want to split my meteor app into web and mobile/cordova parts, however I do not want to duplicate code nor create 2 separate projects. I also want to use React instead of Blaze, as I am more familiar with it (only recenlty started using meteor). There are a lot of discussion how to better split your code for web/mobile (just google), however I liked local packages approach and determined to make it work.

I have found this great github repo which shows how to split web and app code, however I am struggling to achieve similar results when adding react. So if someone has a repo or post about how to do it, please share. If no, may be we can make it easy for other developers by making a step by step guide here in this thread.

I have not done anything with packages in meteor. So please be patient :slight_smile:

Currently I am struggling with even making one package working in my meteor app. So far I have the following (after creating and cleaning meteor app):

  1. Run the following command

    meteor create --package app-base

  2. added some code to app-base.js:

    Meteor.startup(function() {
    console.log("[App-Desktop] Initialized!");

    // Call some sample functionality from our app-base functions
    // var r = baseFunction();
    console.log("[App-Desktop] baseFunction() returned ");
    });

  3. Added layout.html:

    Programming Language List (Desktop)

  4. added files to package.js:


    api.addFiles([‘app-base.js’, ‘layout.html’]);

  5. added app-base to .meteor/packages file

At this point I have console.logs in the browser however the page is blank. I was expecting

Programming Language List (Desktop)

'to be on the page… However it does not appear :frowning:

PS I do not want to jump straight to react, want to understand packaging first. I have read this great blog post, however it is tailored for writing distributed packages, while I just need to split my app into local packages.