webpack单独的构建文件

Question

I have a nested directory structure with jsx modules, like app/js/header/index.jsx app/js/task/runner.jsx and so on

is it possible to have webpack transpile each one of them and output the result in the same directory as the jsx file?

Regards

Answer 1

If I understand you correctly, you want to put resulting module next to each source module. It seems that you can achieve this with a plugin:

var fs = require('fs');
function MyPlugin() {}

MyPlugin.prototype.apply = function(compiler) {
  compiler.plugin('emit', function(compilation, callback) {

    compilation.modules.forEach(m => {
      if (/filename/.test(m.resource)) { // test for filename to exclude node_modules
        fs.writeFileSync(m.resource + '.transpiled', m._source._value);
      }
    });

    callback();
  });
};

and in the webpack config:

{
...
plugins: [ MyPlugin() ],
...
}

Is it what you are trying to do?