Как вывести на консоль эффективный конфиг сборки webpack?

Question

У меня сложная конфигурация конфигурации веб-пакета (объединение динамических настроек с несколькими конфигурационными файлами), и я хотел бы посмотреть, какую конечную конфигурацию использует веб-пакет, то есть результат объединения всех этих настроек и настроек по умолчанию.

Как это можно сделать?

Answer 1

у меня также хорошо получилось, я создал все необходимые мне конфиги перед оператором экспорта, а затем экспортировал функцию, которая может поддерживать и возвращать конфиги

module.exports = () => {
  // I have two configs to export and wanted to see the rules
  // you may not see the nested objects then you have to console log them
  // directly

  console.log(config[0].module.rules);
  console.log(config[1].module.rules);
  return config;
};

Answer 2

У меня это работает с webpack 4.x:

let config = {
  // ...
  plugins: [
    // ...
    { // anonymous plugin
      apply(compiler) {
        compiler.hooks.beforeRun.tapAsync('MyCustomBeforeRunPlugin', function(compiler, callback) {
          // debugger
          console.dir(compiler.options)
          callback()
        })
      },
    }
  ]
}

Когда вы раскомментируете оператор debugger и запускаете сборку с флагом --inspect-brk (node --inspect-brk run-webpack.js), вы также можете увидеть егов Chrome devtools на странице chrome://inspect/ (полезно для проверки функций и экземпляров объектов, которые нельзя сериализовать в консоль).