【问题标题】:Next.js: How to get static assets from within getStaticPropsNext.js:如何从 getStaticProps 中获取静态资产
【发布时间】:2021-04-27 19:42:35
【问题描述】:

我正在使用 Netlify CMS。我想将轮播的所有幻灯片导入到我的组件中。我制作了一个名为滑块的集合并添加了一些幻灯片。这在public/content/slider/ 中创建了两个降价文件(每张幻灯片一个)。我想将它们全部导入一个可迭代对象中,以便构建轮播。

因为我为markdown文件设置了webpack loader,所以我可以导入单个markdown文件没有问题,像这样:

import post from '../public/content/posts/[post name].md

但是当我尝试使用require.contextrequire-context或导入fs时,就不行了。所以我决定尝试从getStaticProps 中要求这些库。但是getStaticProps 中的__dirname/,是我计算机文件系统的根目录。

所有getStaticProps 示例都使用数据获取。我缺少一些信息。如何导入/slides/文件夹中的所有markdown文件?

【问题讨论】:

    标签: node.js reactjs next.js netlify-cms


    【解决方案1】:

    这是 known issue in Next.js__dirname 错误地解析为 / - 您应该改用 process.cwd()

    来自 Next.js Reading files 文档:

    文件可以直接从getStaticProps中的文件系统读取。

    为此,您必须获取文件的完整路径。

    由于 Next.js 将您的代码编译到单独的目录中,因此您不能 使用__dirname 作为返回的路径将不同于 页面目录。

    相反,您可以使用process.cwd(),它会为您提供所在的目录 Next.js 正在执行中。

    【讨论】:

      猜你喜欢
      • 2021-12-11
      • 2021-02-15
      • 2020-07-03
      • 2021-03-31
      • 2019-01-20
      • 2023-03-19
      • 2021-07-08
      相关资源
      最近更新 更多