Vercel部署报错TypeError: 无法读取undefined的属性'and'求助

API 探路者

2026-7-7

问题定位与解决方案

问题原因

你遇到的TypeError: Cannot read properties of undefined (reading 'and')是因为next-transpile-modules@9.1.0版本不兼容Next.js 14。Next.js 14对webpack的CSS loader配置结构做了调整，旧版本的next-transpile-modules插件仍在使用过时的方式访问配置属性，导致构建时找不到issuer.and属性报错。

另外，Next.js从12版本开始已内置transpilePackages配置项，完全可以替代next-transpile-modules的功能，无需再依赖这个第三方插件。

解决步骤

1. 卸载next-transpile-modules

执行命令移除该依赖：

npm uninstall next-transpile-modules
# 若使用yarn则执行
yarn remove next-transpile-modules

2. 修改next.config.js配置

替换原有的withTM配置为Next.js内置的transpilePackages：

/** @type {import('next').NextConfig} */
const nextConfig = {
  images: {
    domains: ["res.cloudinary.com"],
    loader: "cloudinary",
    path: "https://res.cloudinary.com/",
  },
  i18n: {
    locales: ["en", "fr"],
    defaultLocale: "fr",
  },
  // 指定需要转译的第三方包
  transpilePackages: ["gsap"],
};

module.exports = nextConfig;