Webpack: for some modules, leave the 'require' statement as is

Question

Goal: For some libraries matching a pattern P, have webpack emit / compile the require statement as is.

Example:

1. Suppose I have a mylib that I want to got through as-is, so that require works at run-time.

2. and code like this.

var b = require("./some.stuff.that.webpack.should.inline"); a = require('mylib/should/stay/a/Require');

I want output that looks like this

  /******/ ([
  /* 0 */
  /***/ function(module, exports, __webpack_require__) {

          a = __webpack_require__(1);


  /***/ },
  /* 1 */
  /***/ function(module, exports) {

          module.exports = require('mylib/should/stay/a/Require');

I know a Plugin can do this, but I am having trouble intercepting the right event/ understanding the plugin docs

Tried so far: 1. external... this assumes definition is somewhere else 2. IgnorePlugin gives a webpackMissingModule ... the opposite of what I want.

Answer 1

With your first attempt you probably was referring to https://webpack.js.org/configuration/externals/, so most likely you were very close to come up with a solution.

To be honest using externals might be bit unintuitive, as it is not fully documented and it requires to specify the loading mechanism as a part of a string (instead of proper js object).

To instruct webpack to leave some require as-is, please use something like that in your config file (tested with v4.25.5):

const IGNORED = ['dep1', 'dep2']

module.exports = {
  // ...
  // other options
  // ...
  externals: IGNORED.reduce((acc, p) => (acc[p] = `commonjs ${p}`, acc), {})
};

If you need a bit more flexibility use the function approach:

 externals: (_, req, cb) => {
    if (IGNORED.indexOf(req) >= 0) {
      return cb(null, `commonjs ${req}`)
    }
    cb()
  }

If you omit commonjs global scope will be used to resolve the dependency.