即使我只在 "getStaticProps()" 中使用 fs 代码，也找不到模块 'fs/promises' - 下一个 js

Question

所以，我使用最新版本的next js ^11.1.2。根据文档，在 getStaticProps() 函数中使用服务器端（节点 js）代码很好，因为它从客户端构建中删除了 'fs' 导入。

但在我的情况下它不起作用。

下面的代码是我做的...

    import fs from "fs/promises";
    import path from "path";
    
    function HomePage(props) {
      return (
        <ul>
          {props.products.map((el) => (
            <li key={el.id}>{el.title}</li>
          ))}
        </ul>
      );
    }
    
    export async function getStaticProps() {
      try {
        let data = await fs.readFileSync(
          path.join(process.cwd(), "data", "dummy-backend.json")
        );
        console.log(data);
        data = JSON.parse(data);
        return {
          props: {
            products: data.products,
          },
        };
      } catch (err) {
        console.log(err);
        return {
          props: {
            products: [],
            error: "Error in fetching data",
          },
        };
      }
    }
    
    export default HomePage;

Picture of the error displayed in the terminal

而且我在开发环境中。

Answer 1

使用

import { promises as fs } from 'fs';

而不是

import fs from "fs/promises";

并将 fs.readFileSync 更改为 fs.readFile。