[Feature](Docs) Give names to anonymous arrow functions in docs examples

[awareness481]

For example, in api-routes

we have this example

export default (req, res) => {
  res.statusCode = 200
  res.setHeader('Content-Type', 'application/json')
  res.end(JSON.stringify({ name: 'John Doe' }))
}

Exporting anonymous functions is arguably bad practice. If this agreed upon, I think any examples containing anonymous exports should be changed to use named functions

[timneutkens]

Feel free to send a PR.

[Jashnm]

Hey, if this issue is not assigned to anyone, can I take this up?
If yes, should I use arrow functions or regular functions?

[timneutkens]

For sure @Jashnm, regular functions is fine!

[awareness481]

Obviously the PR is going to be reviewed by one of the Next.js maintainers but I wanted to say that it looks good to me. Nice contribution @Jashnm !

[lcswillems]

Why is exporting anonymous functions a bad practice? @awareness481

[ljosberinn]

@lcswillems

• named exports are better for treeshaking
• the barrier of renaming named exports is larger than for default exports, but even then, a named export is find-and-replace-able:

import something from 'somewhere' // Something is internally called foo though
import { foo as something } from 'somewhere' // can find-replace foo easily here

this goes hand in hand with better refactoring support in editors

• named exports usually have better autocompletion support for editors (although this is changing)

Personally, I consider default exports to be bad practice because of mentioned reasons and actively lint against them. In places where I have to use default exports, e.g. nextjs pages, I // eslint-disable-next-line import/no-default-export.

[lcswillems]

Thank you for your answer @ljosberinn !

[balazsorban44]

This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.