Learning Meteor.js [Part 17]: The challenge of getting postal.js to work in meteor

TLDR: You can install packages directly from npm into a meteor app. Do this whenever possible.

To continue the master/details scenario described on my previous post, I wanted to use some form of messaging so that the component that lists the recipes and the component that shows the details of a recipe are detached. My go-to library for this kind of thing is postal.js, little did I know that it would be a struggle to get this thing to even load in meteor.

The obvious thing to do first is to install postal.js from atmosphere. Doing this failed to build complaining that it was missing lodash. All right, install lodash from atmosphere (pick one). Still failed.

Okay fine, let's just add the postal.js script directly. Download the latest release from github and drop it in somewhere in the 'imports' directory and import it from a client file. Failed to build again with some other message that lodash is missing. Ggrrr. What if I also drop in the lodash script? Fail.

Maybe it doesn't work from the new 'imports' directory, move the stuff back into the root 'client' directory. Still fail.

Fine. Fine. By-pass meteor's build system and drop the scripts into the 'public' folder and add a good old <script> tag on the header. Now it fails because the way meteor bundles the file has the lodash package after the header. Dammit. I just want to use a 3rd party library!

To cut the story short, turns out you can simply install using npm directly using 'meteor npm install --save' which will modify the package.json file like any other node app. Then you can directly import scripts from npm packages as if it was any other meteor module.

Great! EXCEPT, this broke the heroku deployment because the build pack that I was using didn't know how to install packages from npm. (T_T). I had to make further changes to my heroku app to take this back on track. Sigh.