import css from node_modules in meteor 1.4 with react

Question

I want to use an npm package, namely react-date-picker in my Meteor 1.4 project using React. The react-date-picker package comes with some css that must be included in order to render correctly. I need to tell meteor to load node_modules/react-date-picker/index.css and include it with the rest of its css, but I'm at a loss on how to do this. Others have suggested that you can simply import the css from within the .jsx component like this

import 'react-date-picker/index.css'

but doing so results in a crashing server that chokes on the first line of the css (as it appears to be parsed as a standard javascript file)

(function (exports, require, module, __filename, __dirname) { .react-date-field {
                                                              ^
) SyntaxError: Unexpected token .
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:373:25)
    at Object.Module._extensions..js (module.js:416:10)
    at Module.load (module.js:343:32)
    at Module.Mp.load (/Users/gsferrer/.meteor/packages/babel-compiler/.6.9.1.7f3rvr++os+web.browser+web.cordova/npm/node_modules/reify/node/runtime.js:16:23)
    at Function.Module._load (module.js:300:12)
    at Module.require (module.js:353:17)
    at require (internal/module.js:12:17)
    at npmRequire (/Users/gsferrer/Projects/xxx/.meteor/local/build/programs/server/npm-require.js:129:10)
    at Module.Mp.useNode (packages/modules-runtime/modules-runtime.js:69:1)
=> Exited with code: 1
=> Your application is crashing. Waiting for file change.

So what is the preferred method to import css from node_modules using Meteor with React?

Answer 1

As you say, it appears to be parsed as JS. However, importing a CSS this way is correct and usually works, so there must be something weird going on... So I'm going to try a wild guess: Try renaming the file from index.css to something else, like react-date-picker.css. It could be that the "index" name is triggering the JS interpretation.