从JavaScript ES6中的文件夹导入所有json文件[重复]

Posted 2023-02-22

【中文标题】从JavaScript ES6中的文件夹导入所有json文件[重复]

【英文标题】：Import all json files from folder in JavaScript ES6 [duplicate]

【发布时间】：2017-06-15 15:50:33

【问题描述】：

我有一个文件夹，里面有很多 JSON 文件：

-json
--file1.json
--anotherfile.json
  ...
--lastfile.json

如何在不明确定义名称的情况下从该文件夹中导入所有文件？

假设，我应该使用这样的东西：

import * as jsonFiles from './json'

但它不起作用。

那么，我该怎么做呢？

重要提示：这不是 Node.js，我在客户端将它与 React 一起使用。

【问题讨论】：

不是重复的，这个问题明确地说'没有明确定义他们的名字'。对于以编程方式定义的导入列表，应使用require 而不是import。这可以通过require-dir-all 或其他方式完成。

@JoeClay 这个问题与你提出的不同，我想导入 json 文件，并在客户端进行。

@estus - 啊，是的，这很公平。投票被撤回！

如果它是前端而不是后端（例如 Node），那么我认为您需要使用某种形式的 AJAX。

@我知道他们的结构，差不多就行了。

【参考方案1】：

无法从客户端检索来自服务器端的文件列表，特别是如果应用程序不是使用构建工具预构建而是使用 ES6 模块加载器。

这里正确的做法是在客户端通过AJAX请求检索jsonFiles对象，服务器负责读取目录并将JSON文件合并为单个对象。

【讨论】：

这里有些误解。我正在开发客户端的 React 库，所以我想将所有这些 json 文件放在一个反应​​文件中。未提及客户端-服务器通信。

您提供了es6-module-loader 标签。这意味着模块是动态加载的。如果不是这样，则问题是错误的，并且错过了有关如何构建库的详细信息。

我有 react jsx 文件，我想在其中加载所有这些 json 文件。它们不会动态加载。我错过了什么？

您如何构建您的应用程序？是 Webpack 还是别的什么？

是的，使用 Webpack。