Write custom webpack resolver

I'm planning on using a set of a little bit more sophisticated conventions to import assets in my webpack project. So I'm trying to write a plugin that should rewrite parts of requested module locators and then pass that down the resolver waterfall.

---

Let's assume we just want to

• check if a requested module starts with the # character and
• if so, replace that with ./lib/. The new module locator should now be looked up by the default resolver.

This means when a file /var/www/source.js does require("#example"), it should then actually get /var/www/lib/example.js.

---

So far I've figured out I'm apparently supposed to use the module event hook for this purpose. That's also the way chosen by other answers which unfortunately did not help me too much.

So this is my take on the custom resolve plugin, it's pretty straightforward:

function MyResolver () {}
MyResolver.prototype.apply = function (compiler) {

  compiler.plugin('module', function (init, callback) {
    // Check if rewrite is necessary
    if (init.request.startsWith('#')) {

      // Create a new payload
      const modified = Object.assign({}, init, {
        request: './lib/' + init.request.slice(1)
      })

      // Continue the waterfall with modified payload
      callback(null, modified)
    } else {

      // Continue the waterfall with original payload
      callback(null, init)
    }
  })

}

However, using this (in resolve.plugins) doesn't work. Running webpack, I get the following error:

ERROR in .
Module build failed: Error: EISDIR: illegal operation on a directory, read
 @ ./source.js 1:0-30

Apparently, this is not the way to do things. But since I couldn't find much example material out there on the matter, I'm a little bit out of ideas.

---

To make this easier to reproduce, I've put this exact configuration into a GitHub repo. So if you're interested in helping, you may just fetch it:

git clone https://github.com/Loilo/webpack-custom-resolver.git

Then just run npm install and npm run webpack to see the error.

via Loilo