Webpack – circumvent dependency on folder structure inside 3rd party module

Question

Using webpack, I use a require call to load a css file out of the node_modules folder.

Part of my config:

resolve: {
  modulesDirectories: ['src/js', 'node_modules'],
},

The actual require call looks like this: require('purecss/build/pure.css').

While working flawlessly, I am a bit uneasy about the purecss/build/ bit because I depend on the folder structure inside the third party module. If they change something, my app will inevitably break. Is there a way to circumvent this (e.g. globbing patterns)?

Answer 1

You probably want the resolve.alias config option. It lets you specify an alias for a location from which you'll load modules. Abstracting it this way means your source code can use whatever makes sense, and you can manage the dependency on the 3rd party path in your config.