如何解决使用react和next.js时未找到fs模块的错误

Question

使用没有路由器设置的react应用程序。我想构建我的sitemap.xml文件。我尝试了一些模块，如sitemap.js，react-router-sitemap，sitemap-generator。但是这些模块在丢失fs模块时抛出错误。我通过npm install --save安装了fs模块。但它仍然显示错误。

我在一些论坛中发现在webpack.config文件中添加以下代码。

节点：{     fs：＆＃34;空＆＃34;    } 我不确定这个文件在哪里。我无法找到与站点地图相关的模块。

请帮我解决这个问题。我有新的反应。

这是我的文件夹结构。

Answer 1

创建next.config.js并放在下面的代码中。对我来说很好。

next.config.js

module.exports = {
    webpack: (config, { buildId, dev, isServer, defaultLoaders, webpack }) => {
      // Note: we provide webpack above so you should not `require` it
      // Perform customizations to webpack config
      // Important: return the modified config

      // Example using webpack option
      //config.plugins.push(new webpack.IgnorePlugin(/\/__tests__\//))
      config.node = {fs:"empty"}
      return config
    },
    webpackDevMiddleware: config => {
      // Perform customizations to webpack dev middleware config
      // Important: return the modified config
      return config
    },
  }