在React / Nextjs的文件夹中导入多个文件

时间:2018-10-11 08:34:08

标签: reactjs webpack next.js

我正在尝试在文件夹中导入具有特定扩展名的多个文件

const allEntries = require.context('../static/blog', true, '/\.md/')

但是我得到了:

Unhandled Rejection (TypeError): __webpack_require__(...).context is not a function

我正在使用Nextjs,并且需要其中一个页面中的文件。这里似乎有东西吗?

编辑:我不一定需要通过require来执行此操作,我只想一次即可导入/需要多个文件,而无需知道文件名或多少个文件。文件在文件夹中。

3 个答案:

答案 0 :(得分:0)

您可以在webpack中尝试以下方法:

const glob = require('glob');
const allEntries = glob.sync("../static/blog/*.md"); 

glob将返回文件数组。该数组将包含.md文件夹中所有扩展名为../static/blog/的文件。如果有一个软件包,则不需要安装该软件包。

答案 1 :(得分:0)

尝试使用require context npm库。

$ npm i --save require-context

在您的文件中:

// Load globally into all modules.
require('require-context/register')

// Load locally as a function.
var requireContext = require('require-context');


function requireAll(r) { r.keys().forEach(r); } 

requireAll(requireContext('../static/blog', true, /\.md$/));

答案 2 :(得分:0)

据我了解,您非常亲密;由于使用webpack的错误require.context

const allEntries = require.context('../static/blog', true, '/\.md/')
console.log(allEntries.keys()) // all the files found in the context
allEntries.keys().forEach(allEntries) // require them all