webpack - 如何通过 Webpack 在文件上运行任意 bash 脚本，而无需为每种文件类型维护加载器？

Question

似乎 Webpack 运行通过“加载器”转换代码的工具，而不是直接使用这些工具的 API。这在这些工具上增加了一层抽象，这有时意味着工具的 API 没有完全公开，或者工具的更新需要时间才能在加载器中更新。这是对问题的更详细描述。

我在使用 Grunt/gulp 时遇到了这个问题，最终放弃了那些支持直接使用我通过 npm 运行的 bash 脚本转换我的源代码的问题。是否可以用 Webpack 做同样的事情？如果是这样，怎么做？

Answer 1

我创建了一个名为的自定义 Webpack 加载器shell-loader，它采用任意 shell 脚本并在它加载的每个文件的内容上运行它child_process.exec。我可以像这样使用它webpack.config.js；

{
  test: /.*\.css$/,
  use: [ 'css-loader', { loader: 'shell-loader', options: {
    script: 'postcss --use autoprefixer'
  }} ]
}

作为概念验证，它似乎有效，但我不确定在使用 Webpack 时这是否是一个好主意，或者我是否正在将它们不应该的东西一起破解。