Question

我有一个网络应用程序需要配置JSON文件，其中包含端点和其他必需的启动参数。

如果我使用json-loader，文件不是“真正的json”，它看起来像这样：

require

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

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

有没有办法可以$bonus = intval(17 / 5);一个JSON文件，它写成一个普通的JSON文件并在运行时导入？

Answer 1

我有没有办法require一个JSON文件，它写成一个普通的JSON文件并在运行时导入？

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

从理论上讲，可以使用webpack加载器，假设从文件加载器获取输入的 async-file-loader 将为您处理异步请求。让我们假设：

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

但是，处理请求的整个逻辑将在该调用中受到限制。 async-file-loader看起来像这样：

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

非常讨厌......

如果要在运行时加载json文件，我会看到2个选项：

使用文件加载器并自行请求json文件。
使用服务器端脚本语言并将配置注入.html文件。如果您在后端使用nodejs并表达，则可以在提供请求之前使用Cheerio轻松注入配置。

Answer 2

正如ShabbY所说，Webpack是一个模块捆绑器，可以提前编译文件。

听起来您需要在构建时间之后添加配置文件（json）以便在运行时访问。为此，解决方案是使用普通的ajax调用来加载文件，而不是尝试将其与Webpack捆绑在一起。

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

2 个答案: