json - 如何使用 Webpack 将所有子目录中的 JSON 文件合二为一？

Question

假设我有一个结构如下的目录:

1. folder A
  1a. some_file.js
  1b. data.json
2. folder B
  2a. folder B1
     2a1. other_file.json
     2a2. data.json
  2b. folder B2
     2b1. data.json
3. output.json

有没有可以结合 data.json的webpack loader在所有子文件夹中，并将其输出到 output.json ?

我找到了 https://www.npmjs.com/package/json-files-merge-loader这似乎做了类似的事情，但它似乎要求每条路径到 data.json ，而我需要通过 data.json 的所有文件夹和子文件夹的东西.全部 data.json键是唯一的，我想要 output.json成为一个 JSON 对象，包含所有 data.json 中的所有键/值对.

Answer 1

webpack 并不真正适合您的用例。很多人认为 webpack 可以替代构建系统，但它只是一个模块捆绑器，并不能处理所有任务。具体来说:

webpack 遍历 require()和 import语句，这意味着它需要静态定义模块。可以通过编写插件或使用从模板生成的文件来解决这个问题，但即使你这样做了......

webpack 将很难以您想要的方式组合 JSON 文件。 webpack 擅长将文件捆绑到某种模块系统(CommonJS 或 AMD)中。您想要的不是包含模块的包，而是包含任意内容的文件。

webpack 或许可以使用一些花哨的插件来完成这些事情，但这可能不值得。在您的情况下，您可能只想编写一个 Node 脚本。如果需要，可以使用 plugin like this在构建之前运行代码。

const fs = require('fs');
// https://github.com/isaacs/node-glob
const glob = require('glob');

const output = {};

glob('src/**/*.json', (error, files) => {
    files.forEach((filename) => {
        const contents = JSON.parse(fs.readFileSync(filename, 'utf8'));
        Object.assign(output, contents);
    });

    fs.writeFileSync('output.json', JSON.stringify(output));
});