Why not `index` files?

Why-not-index-files.md

Why not index files

Using index.{jsx,tsx} for Components or index.{js,ts} for other files

• Hard to search for a component or file based on it’s name (the index file is only on the 7th result)

• Opening several index files in the IDE results in hard to read tabs with needless index keywords

• ES Modules in browsers (based on the spec) do not support index files resolutions (have to pass the explicit file name and the extension)
• ES Modules in Node.js are compliant to the spec, so also doesn’t support it
  • https://nodejs.org/api/esm.html#mandatory-file-extensions
  • https://blog.logrocket.com/es-modules-in-node-today/
• Ryan Dahl, the creator of Node.js, talks about things he regrets in the Node.js design and one of them is adding the index resolution feature
  • 10 Things I Regret About Node.js - Ryan Dahl - JSConf EU

What about using index files only to re-export other files?

• Requires more discipline or linting to enforce proper convention
• It’s easy to fall for an indirection pattern where you import some stuff from other files and export them in different names
  • Which makes it harder to navigate the code with Jump to Definition or Find References
• Confusing to choose between importing from the index or explicitly from the target file
  • Sometimes we don’t need everything from the index but only 1 thing
  • Importing needless stuff can bloat up the bundle size
• Other good reasons against it:
  • Optimal JavaScript module design - The index module anti-pattern

What about TypeScript?

TypeScript does support it out of the box, but we have to set moduleResolution: "node" if we set module to es2015 or above

• Documentation - Module Resolution