How to require a css file using NPM and Meteor?

Question

I want to add a date-date element ( https://github.com/zippyui/react-date-picker ). It says that I need to add lines

require('react-date-picker/index.css'); var DatePicker = require('react-date-picker'); 

And using meteorhacks: npm and browsify, the module works for me.

/server/declarations.js

 DatePicker = Meteor.npmRequire('react-date-picker'); 

/lib/app.browserify.js

 DatePicker = require('react-date-picker'); 

But how can I get a CSS file that styles the module to work? I don't know where to put require('react-date-picker/index.css') without throwing a syntax error. And I cannot assign it to a variable, so what should I do?

Answer 1

When Meteor 1.3.2 comes out, you can do in foo.js :

import "npm-package-name/path/to/style.css";

If you are <1.3.2, the workaround is to create a package in packages/my-asset-imports as follows:

https://gist.github.com/BretFisher/9ea1ba440cb999af9c95

Answer 2

You don't need meteorites: npm!

Upgrade the app to Meteor 1.3 Beta by following this guide: https://github.com/meteor/meteor/issues/5788

Then read here how to use the new features: https://github.com/meteor/meteor/blob/release-1.3/packages/modules/README.md

This completely solves your problem.