NextJs Next.config.mjs 导入本地常量文件

Question

在next.config中导入本地文件

问题

您好，我们面临的问题是想要创建一个动态的下一个配置。当我们不导入任何文件时，这工作正常，但当尝试在 next.config.mjs 中导入常量文件时，事情就会崩溃。

我们使用下一个版本 12.1，以便使用配置文件的 MJS 变体。

常量文件是一个简单的 JS 文件，其中包含一些值来确定我们支持的不同品牌需要使用的区域设置。这些值在多个地方使用，这就是为什么我们不想在这里对这些值进行硬编码。

import { locales } from './src/constants/locales'; // It breaks on this import

const currentPlatform = process.env.NEXT_PUBLIC_PLATFORM;

module.exports = () => ({
  i18n: {
    localeDetection: false,
    ...locales[currentPlatform],
  },
  images: {
    domains: [
      // Our domains
    ],
  },
  async rewrites() {
    return [
      // Our rewrites
    ];
  },
  webpack: (config, { defaultLoaders }) => {
    config.module.rules.push(
      // Our config
    );

    return config;
  },
});

错误信息

这是我们尝试启动开发服务器时抛出的错误，表明导入路径错误。（它不是。）

error - Failed to load next.config.mjs, see more info here https://nextjs.org/docs/messages/next-config-error
Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/Users/*****/Development/****/********/src/constants/locales' imported from /Users/******/Development/******/******/next.config.mjs
Did you mean to import ../src/constants/locales.js?
    at finalizeResolution (internal/modules/esm/resolve.js:276:11)
    at moduleResolve (internal/modules/esm/resolve.js:699:10)
    at Loader.defaultResolve [as _resolve] (internal/modules/esm/resolve.js:810:11)
    at Loader.resolve (internal/modules/esm/loader.js:86:40)
    at Loader.getModuleJob (internal/modules/esm/loader.js:230:28)
    at ModuleWrap.<anonymous> (internal/modules/esm/module_job.js:56:40)
    at link (internal/modules/esm/module_job.js:55:36) {
  code: 'ERR_MODULE_NOT_FOUND'
}

• = 审查路径名

欢迎任何提示、技巧或额外信息！

提前致谢。

Answer 1

也许您正在使用.vercelignore但不包含该文件/文件夹。我犯了同样的错误，就我而言，我没有包括在内!/lingui.config.js。

> Build error occurred
Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/vercel/path0/lingui.config.js' imported from /vercel/path0/next.config.mjs
    at new NodeError (internal/errors.js:322:7)
    at moduleResolve (internal/modules/esm/resolve.js:731:10)
    at Loader.defaultResolve [as _resolve] (internal/modules/esm/resolve.js:842:11)
    at Loader.resolve (internal/modules/esm/loader.js:89:40)
    at Loader.getModuleJob (internal/modules/esm/loader.js:242:28)
    at ModuleWrap.<anonymous> (internal/modules/esm/module_job.js:76:40)
    at link (internal/modules/esm/module_job.js:75:36) {
code: 'ERR_MODULE_NOT_FOUND'
}

为了解决这个问题，我添加了丢失的文件：

/*

!/public
!/src
!/lingui.config.js # <-- my mistake
!/next-env.d.ts
!/next.config.mjs
!/package.json
!/postcss.config.js
!/tailwind.config.cjs
!/tsconfig.json
!/yarn.lock