Use package.json in your Meteor App For Fun & Profit


by Gerard Sychay

File this one under quick tips.

If you've ever written a Node.js application, you've seen the package.json file. Usually, you need it to specify npm modules that the app depends on, but package.json has a lot of other capabilities. For example, you can specify the node version required for the app.  The package.json file is a node concept, but since we're talking about Meteor here, we're not crossing any streams. 

An oft-forgotten feature is the package.json scripts field. In a nutshell, it allows you to specify shortcuts for long command, and then run those shortcuts.

:::

How can I use this in Meteor? I don't know about you, but I always, always forget to specify my Meteor settings file when starting Meteor. It gets quite annoying as the some aspect of the app crashes before I even notice. So I've gotten in the habit of using npm start. My app crashes have gone way down ever since.

// package.json (comments won't work in real JSON files)

{
  "name": "myapp",
  "scripts": {
    "start": "meteor --settings settings.json"
  }
}
$ npm start
Important note: some shortcuts, such as start are reserved. This means you can run them with npm start. All other shortcuts must be run with npm run <task>.

I recently developed a Meteor project that used the built-in Cordova integration. The Cordova workflow allows you to start your Meteor app in the iOS simulator, or in Xcode. I was always mixing up these commands, so I created some shortcuts.

{  
  "name": "myapp",
  "scripts": {
    "start": "meteor --settings settings.json",
    "simulate": "meteor run ios --settings settings.json",
    "ios": "meteor run ios-device --settings settings.json"
  }
}

 

Now I can start my app in Xcode by running npm run ios.

Furthermore, we were using Polymer components for the look-and-feel, and a Facebook app. So for pushing production builds, I wanted to be sure to optimize Polymer with vulcanize and also to use my production Facebook app ID, and not my test ID. This turned into a long command just get a production iOS build that was impossible to remember. npm scripts to the rescue.

{  
  "name": "myapp",
  "scripts": {
    "start": "meteor --settings settings.json",
    "simulate": "meteor run ios --settings settings.json",
    "ios": "meteor run ios-device --settings settings.json",
    "build": "NODE_ENV=production VULCANIZE=true meteor build ../myapp-dist --server=https://api.myapp.com/ --mobile-settings settings-production.json"
  }
}

 

Now, npm run build will build a production app ready to upload through Xcode.

:::

I regularly use one other benefit of package.json, which may or may not be relevant to you. If you host your Meteor apps on Modulus, the modulus CLI will read a mod-project-name field from your package.json, and then you won't have to specify the project when you run modulus deploy

{  
  "name": "myapp",
  "mod-project-name": "myapp"
}

:::

We are saving only keystrokes here, but they add up! With more free minutes in your day, you are sure to prosper! Happy coding! 

BONUS TIP! Dean Radcliffe gives us a bonus tip over on Crater.io: "The scripts section of package.json serves like a makefile/Rakefile which lists useful commands when 'npm run' is run with no args."

Share Share on Twitter Share on Facebook Share on LinkedIn

How Can We Help?

Reaching out doesn’t mean you’re ready to start a project, but we’d love to learn more about the challenge you’re facing, answer any questions, and see if we might be a good fit for working together.

Contact Us