Hello!
The following feels to me like a missing feature in the language: the ability to import files directly from their containing folder, by referencing their file names.
This would basically mimic the behaviour of barrel files (an index.js file that reexports the default export from all files in the folder as a named export, see https://basarat.gitbook.io/typescript/main-1/barrel), with two exceptions:
- We wouldn’t need to pollute our folder structure with these unnecessary
index.jsfiles - We would import only the files we need (i.e. automatic tree shaking, ignoring all sibling files imported in the barrel file)
If we import { fileName } from './directory', and file would contain a default export, it would be assigned to the fileName variable. If fileName would contain named exports, they would be available as fileName.namedExport.
The desired behaviour is similar to the functionality provided by https://github.com/Anmo/babel-plugin-import-directory, again with two exceptions:
- The ability to import single files from a directory
- No requirement to use an asterisk after the directory name
I am fairly experienced with JavaScript, but lack insight into whether this feature belongs at the language level, or in the tooling, because of potential conflicts/order of precedence e.g. with Webpack configuration where you can leave out certain extensions or entire filenames (e.g. index.js).
It seems logical to let the current behaviour take precedence, i.e. only import the default export from file.js if there’s no index.js in ./directory. Even if index.js exists but does not contain export const file = ..., it seems better not to fall back to the new behaviour. So only when the file cannot be resolved.
I think this feature would be very ergonomic for projects written in a functional style where every function occupies a separate file.