While working on my Next.js project, I was in the process of writing the middleware.ts file when I encountered an interesting situation:
// scenario 1
export const middleware = (...) => {...} // middleware works
export const config = {
matcher: '/about', // matcher works
};
// scenario 2
const middleware = (...) => {...} // middleware works
const config = {
matcher: '/about', // matcher does not work
};
export { middleware, config }
In scenario 1, the matcher works fine, but in scenario 2, it doesn't.
I believed that these methods of exporting functions and objects were equivalent. Is there a practical difference (in terms of JavaScript modules)? Or is there a distinction in how Next.js handles them specifically for the middleware.ts file?
Additional information: Next.js version 15.0.0-rc.0
UPDATE: I have also raised this issue on the Next.js Github Repository (link). There is a codesandbox example available for this issue as well (link).