使用Webpack将JSON捆绑为普通的JSON文件

Question

我有一个Web应用程序,需要配置JSON文件,其中包含端点和其他所需的启动参数.

如果我使用json-loader,文件不是"真正的json",它看起来像这样:

module.exports = {
    "name": "foo",
    "key": true,
};

我想要的是简单的旧JSON,这意味着它可以作为部署过程的一部分进行解析和更改,然后发送到将从中提供服务的Web服务器.

另一种方法是使用文件加载器.但是,这意味着(即使这是一项微不足道的任务)我必须自己编写代码来下载文件.我想让webpack处理这个并且可用.

有没有办法可以require将JSON文件写成一个普通的JSON文件并在运行时导入？

Answer 1

有没有办法可以require将 JSON 文件编写为普通的 JSON 文件并在运行时导入？

Webpack 在编译时起作用。这意味着当您需要一个文件时，它会加载该文件，执行加载器链指定的修改，并从该链中导出最终结果。所以你所要求的听起来像一个加载器，它的作用就像一个文件加载器，但导出一个 IIFE，它返回一个对所需文件的承诺。

从理论上讲，可以有一个 webpack 加载器，假设一个从文件加载器获取输入的异步文件加载器将为您处理异步请求。让我们假设如下：

const promisedFile = require('async-file-loader!file-loader!./myJson.json');
promisedFile.then(file => { console.log(JSON.parse(file)); });

但是随后处理请求的整个逻辑将被限制在该调用中。异步文件加载器看起来像这样：

module.exports = function(source) {
    return `module.exports = eval("(function(url){
      /* define async request func, preform request and return promise in here */
   })(${url})")`;
}

好恶心...

当您想在运行时加载 json 文件时，我会看到 2 个选项：

1. 使用文件加载器并自行异步请求 json 文件。
2. 使用服务器端脚本语言并将配置注入 .html 文件。如果your're使用和的NodeJS表达例如在后端侧，你可以轻松地将使用配置Cheerio服务请求之前。