У меня есть проект Next. js, настроенный со следующей структурой папок:
- src
- components
- Header
- Header.tsx
- Header.styles.ts
- index.ts ( `export { Header } from "./Header"` )
- Footer
- Footer.tsx
- Footer.styles.ts
- index.ts ( `export { Footer} from "./Footer"` )
- index.ts ( `export { Footer } from "./Footer"` and `export { Header } from "./Header"` )
Я также настроил Babel со следующей конфигурацией:
{
"plugins": [
[
"module-resolver",
{
"root": ["src"],
"extensions": [".js", ".ts", ".tsx"]
}
]
]
}
This Настройка позволяет мне сделать следующее: import { Header, Footer } from "components"
. Я ищу, чтобы избавиться от всех этих index.ts
файлов. Все индексные файлы в папках компонентов содержат export { COMPONENT_NAME } from "./COMPONENT_NAME"
. И файл универсального индекса в папке компонентов также содержит export { COMPONENT_NAME } from "./COMPONENT_NAME"
для каждого из компонентов.
Как я могу настроить Babel, чтобы разрешить мне сделать import { Header, Footer } from "components"
и сделать так, чтобы он расширился до:
import { Header } from "components/Header/Header"
import { Footer} from "components/Footer/Footer"
Я использую TypeScript, поэтому любая помощь с как настроить это в tsconfig.json
будет приветствоваться!