Next.js：尽管 next.config.js 中有 exportPathMap，但未找到

Question

错误：

No "exportPathMap" found in "next.config.js". Generating map from "./pages"

但我确实有 exportPathMap 基于 official docs:

我的 next.config.js 包含：

const withCss = require("@zeit/next-css");
const withSass = require("@zeit/next-sass");
const withTM = require("next-transpile-modules");

module.exports = {
  exportPathMap: async function(
    defaultPathMap,
    { dev, dir, outDir, distDir, buildId }
  ) {
    return {
      "/": { page: "/" },
      "/menu": { page: "/menu" },
      "/about": { page: "/about" }
    };
  }
};

module.exports = withCss({
  cssModules: true
});

module.exports = withSass(
  withTM({
    transpileModules: ["react-bulma-components"],
    sassLoaderOptions: {
      includePaths: ["./components"]
    }
  })
);

我也试过删除默认映射：

module.exports = {
  exportPathMap: async function() {
    return {
      "/": { page: "/" },
      "/menu": { page: "/menu" },
      "/about": { page: "/about" }
    };
  }
};

以及根据我的研究将其移动到 withCss() 中：

module.exports = withCss({
  exportPathMap: async function() {
    return {
      "/": { page: "/" },
      "/menu": { page: "/menu" },
      "/about": { page: "/about" }
    };
  }
});

两个导出 withSass() 和 withCss() 似乎可以正常工作，我做错了什么？

编辑：

我的 next.config.js 在根项目目录中，如果你有机会想知道的话。

Answer 1

您多次重新分配 module.exports，因此 exportPathMap 和 withCss 丢失。在这种情况下，配置应如下所示：

module.exports = withCss(
  withSass(
    withTM({
      transpileModules: ["react-bulma-components"],
      sassLoaderOptions: {
        includePaths: ["./components"]
      },
      exportPathMap: async function(
        defaultPathMap,
        { dev, dir, outDir, distDir, buildId }
      ) {
        return {
          "/": { page: "/" },
          "/menu": { page: "/menu" },
          "/about": { page: "/about" }
        };
      }
    })
  )
);

Answer 2

module.exports = withCss(withSass(
 withTM({
 transpileModules: ["react-bulma-components"],
sassLoaderOptions: {
  includePaths: ["./components"]
},
cssModules: true,
exportPathMap: async function(
    defaultPathMap,
    { dev, dir, outDir, distDir, buildId }
) {
    return {
    "/": { page: "/" },
    "/menu": { page: "/menu" },
    "/about": { page: "/about" }
    };
}
})
));

Answer 3

exportPathMap 当前不鼓励 next.js 贡献者。请看一下https://github.com/zeit/next.js/issues/10983#issuecomment-611147932

否则正确答案是

module.exports = withCss(
  withSass(
    withTM({
      transpileModules: ["react-bulma-components"],
      sassLoaderOptions: {
        includePaths: ["./components"]
      },
      exportPathMap: async function(
        defaultPathMap,
        { dev, dir, outDir, distDir, buildId }
      ) {
        return {
          "/": { page: "/" },
          "/menu": { page: "/menu" },
          "/about": { page: "/about" }
        };
      }
    })
  )
);

Next.js：尽管 next.config.js 中有 exportPathMap，但未找到

Next.js: exportPathMap not found despite having one in next.config.js

javascript

next.js