How to configure config in next?

Question

React

Good day.

The original config was:

module.exports = {
  async redirects() {
    return [
      {
        source: '/signup',
        destination: '/sign-up',
        permanent: true,
      },
    ];
  },
};

But now I want to add:

module.exports = (phase) => {
  if (phase === PHASE_DEVELOPMENT_SERVER) {
    return {
      env: {
        test: 'hello',
      },
    };
  }

  return {
    env: {
      test: 'hello world',
    },
  };
};

If you just combine all this into one file, the redirect will not work.

Can you please tell me how to combine these two functions in the next.config.js config?

Answer 1

module.exports = (phase, { defaultConfig }) => {
  if (phase === PHASE_DEVELOPMENT_SERVER) {
    return {
      ...defaultConfig,
      future: {
        webpack5: true,
      },
      redirects: async () => {
        return [
          {
            source: '/sign-up',
            destination: '/signup',
            permanent: true,
          },
        ];
      },
      env: {
        test: 'hello',
      },
    };
  }

  return {
    /* config options for all phases except development here */
  };
};

https://github.com/vercel/next.js/blob/canary/pack...