Export all files in `index.ts`

Question

Would like to be able to import any component in the components directory, directly from the components directory.

The current directory structure is:

src
├── components
│   ├── Camera.tsx
│   ├── Keyboard.tsx
│   └── index.ts
└── screens
    └── App.tsx

And would like to be able to import as follows:

// src/screens/App.tsx

import { Keyboard } from '../components'

The first option is obviously to maintain a long list of exports in src/components/index.ts:

// src/components/index.ts

export { Camera } from './Camera'
export { Keyboard } from './Keyboard'

However, this is cumbersome to maintain. Is there a way using glob and the export object to automagically export all components, or possibly another way all together?

Answer 1

You could achieve that by editing your index.ts to be like this

src
├── components
│   ├── Camera.tsx
│   ├── Keyboard.tsx
│   └── index.ts <=== this file
└── screens
    └── App.tsx

export * from './Camera'
export * from './Keyboard'