[Meteor 1.5.1] Cannot find module when import NPM module in client side JS

help
1

Hi, I’m trying to use some npm modules in client side, but result in cannot find module errors.

I’m using Meteor 1.5.1 and the npm module is buffermaker 1.2.0

The detailed reproduce steps are described in:

I have tried to import it in server side js, there is no problem, but when I import it in client side js (React component), I got following error.

modules-runtime.js?hash=8587d18…:231 Uncaught Error: Cannot find module './lib/BufferMaker'
    at makeMissingError (modules-runtime.js?hash=8587d18…:231)
    at require (modules-runtime.js?hash=8587d18…:241)
    at index.js (modules.js?hash=e9fc8db…:1016)
    at fileEvaluate (modules-runtime.js?hash=8587d18…:343)
    at require (modules-runtime.js?hash=8587d18…:238)
    at main.js (main.js:1)
    at fileEvaluate (modules-runtime.js?hash=8587d18…:343)
    at require (modules-runtime.js?hash=8587d18…:238)
    at app.js?hash=3f48780…:101
2

submit an issue to the buffermaker module, look at index.js

var dir = ‘./lib/’;

will work on server only :wink:

or use browserify (https://guide.meteor.com/using-npm-packages.html#client-npm)

1 Like
3

@lc3t35 Thank you for reply, but according to Meteor: https://guide.meteor.com/using-npm-packages.html#client-npm

Meteor’s ES2015 module system does this for you out of the box with no additional configuration necessary.

It make difference to use browserify ?

4

I agree with @lc3t35. Some of node.js npm package is not supported by meteor client side, so it is necessary to wrap the package by using browserify.

In most cases, you can simply import npm dependencies from a client file, just as you would on the server.

2 Likes
5

Do you have any pointers about how to go about doing this?

6

Hope it help. I found a post.

1 Like
7

The answer is a lot simpler than adding in Browserify!

Turns out buffermaker re-exports it’s main module in a strange way, so first step is to bypass it by importing BufferMaker directly:

import BufferMaker from 'buffermaker/lib/BufferMaker';

Then you’ll find when you call .make(), it will complain about Buffer not existing. To get Buffer on the client, first install meteor-node-stubs

$ meteor npm install --save meteor-node-stubs

Then load the buffer module and stick it on the window so BufferMaker can access it

import { Buffer } from 'buffer';
window.Buffer = Buffer;
/* OR do it with require */
window.Buffer = require('buffer').Buffer;