Revision history [back]

This error occurs when using the firestore-stripe-payments module with Next.js v13 because Next.js v13 supports ECMAScript modules (ES modules) by default. However, the firestore-stripe-payments module uses CommonJS modules, which are not supported in Next.js v13 without some configuration.

To fix this error, you can either:

1. Convert the firestore-stripe-payments module to an ECMAScript module, or
2. Configure Next.js to support CommonJS modules.

If you choose the first option, you can convert the module by changing the require statements to import statements, and exporting the functions using the export keyword instead of module.exports.

If you choose the second option, you can add the following configuration to your next.config.js file:

module.exports = {
  webpack: (config) => {
    config.module.rules.push({
      test: /\.(js|mjs|jsx|ts|tsx)$/,
      use: {
        loader: "babel-loader",
        options: {
          presets: ["next/babel"],
          plugins: ["@babel/plugin-transform-modules-commonjs"],
        },
      },
    });

    return config;
  },
};

This configuration tells Next.js to use the babel-loader with the @babel/plugin-transform-modules-commonjs plugin to transform CommonJS modules to ES modules.