Import assets like fonts or images from node_modules

packages
1

Once again trying to get my app upgraded to 1.3+. Now I stumbled upon the following problem:

If a node_module contains a font (like mdi or fontawesome) or an image file, how do I include this font in my app without any hacks?

So far, I found the following approaches in this forum:

  • manually copy the fonts to the public/ folder
  • run an npm postinstall script to copy the font (but this won’t be platform-independent)

Isn’t there any “official” and safe way to reference specific resources from npm_modules and let the bundler copy them to a location that can be referenced in CSS/SASS? Before 1.3, I was using mquandalle:bower for this, but this package is broken since 1.3.

I would also prefer a way to define the npm dependencies in a local Meteor package instead of patching the global npm package file. In this case, the package would be re-usable across apps without having to think about patching the respective package.json files any time.

So: How is asset handling supposed to work with Meteor’s npm integration?

2 Likes
2

I know you can import css files at least, though I haven’t examined how it works exactly. So maybe importing other files is possible too? Try putting import 'package/image.jpg' in your main.js file or something and then look through your build folder and see if it ended up anywhere.

Here’s how you define NPM dependencies for Meteor packages:

3

Ok, thanks, I will try that out. Would be awesome if you could reference fonts etc. just like any other asset. At the moment, I am using the approach recommended by a community member, using a postinstall script that copies the fonts via cp -R. But that’s not really nice.