webpack - webpack でカスタム リゾルバーを作成することは可能ですか?

Question

モジュールが必要な場合は、独自の規則があります。たとえば、次require("./components/SettingsPanel");のように解決する必要がありますrequire("./components/SettingsPanel/SettingsPanel.js");

そのようなリゾルバーを作成する方法はありますか?

Answer 1

はい、可能です。あいまいさを回避し、実装を容易にするために、規則のマーカーとしてプレフィックス ハッシュ記号を使用します。

require("#./components/SettingsPanel");

次に、これを構成ファイルに追加します (もちろん、後でリファクタリングできます)。

var webpack = require('webpack');
var path = require('path');

var MyConventionResolver = {
  apply: function(resolver) {
    resolver.plugin('module', function(request, callback) {
      if (request.request[0] === '#') {
        var req = request.request.substr(1);
        var obj = {
          path: request.path,
          request: req + '/' + path.basename(req) + '.js',
          query: request.query,
          directory: request.directory
        };
        this.doResolve(['file'], obj, callback);
      }
      else {
        callback();
      }
    });
  }
};


module.exports = {
    resolve: {
      plugins: [
        MyConventionResolver
      ]
    }
    // ...
};