无法解析静态生成项目上的“fs”答案

【问题标题】：Cannot resolve 'fs' on static generate project无法解析静态生成项目上的“fs”
【发布时间】：2021-01-22 22:27:37
【问题描述】：

我想在我的 Next.js 应用程序中提供静态文件，每次它想使用 import fs from 'fs' 时都会给我一个错误；

我不应该为了使用 fs 而必须使用 yarn add fs，为什么它给了我这个？

我的 next.config.js 几乎是空的：


const nextTranslate = require('next-translate');

module.exports = {
  ...nextTranslate(),
};

我当前的动态帖子页面是：

/** @format */
import fs from 'fs';

export default function Doc() {
  return <div>Enter</div>;
}

export const getStaticPaths = async () => {
  return {
    paths: [],
    fallback: false,
  };
};

我仍然收到此错误：

我什至尝试开始一个新项目，但一旦我尝试使用 fs，它也失败了。它是否需要在我的计算机中全局安装？我肯定安装了节点（v14.15.1）。

【问题讨论】：

您的代码好像是在前端执行的？这对stackoverflow.com/questions/50830572/… 有帮助吗？
你不能在浏览器中使用像 fs 这样的 NodeJS 模块。出于明显的安全原因，不允许在浏览器中运行的 JavaScript 访问文件系统。

标签： javascript node.js next.js

【解决方案1】：

fs 是一个内置于 Node.js 中并依赖于 Node.js API 的模块。

它不能在浏览器中运行。所以它不能在典型的 React 组件中运行。

您可以使用它in a server-side only module in Next.js，但如果您想在组件中使用它，那么您可能需要用 Axios 之类的 HTTP 模块替换它，并编写一个服务器端端点来请求您的数据。

【讨论】：