如何在browserify中填充npm包依赖？

Question

So I have a React project, in which I'm actually deploying with react-lite as the footprint is much smaller. I'd like to use react-nouislider , but in it's package.json, I've found this:

"peerDependencies": {
    "react": "^0.14.0"
}

What this means is that whenever I require react-nouislider, it pulls in React instead of react-lite. How do I shim dependencies of an npm package from my top-level package.json?

This is how I'm shimming react-lite in:

"browser": {
    "react": "react-lite"
}

And I tried this, but it didn't work:

"browserify-shim":{
    "react-nouislider": {
        "depends": "react-lite"
    }
}

How is it possible to shim a dependency of a package itself?

Answer 1

Browserify Shim's tagline is:

Makes CommonJS incompatible files browserifyable.

Your issue here is that react-lite is already CommonJS compatible. For any CommonJS compatible file, Browserify will automatically add its dependencies and peerDependencies as appropriate, before Browserify Shim gets involved.

I suggest you change the peerDependencies entry in the react-nouislider package to the appropriate version of react-lite and remove your Browserify Shim config above as it's no longer needed. When you do this, be sure to run any tests in the react-nouislider package to make sure it still works with react-lite instead of React. A good way of doing this is forking react-nouislider to your own repo, making the change there, and pulling from that repo in your package.json .