Какой плагин Babel позволяет мне делать `import {Header, Footer} из" компонентов "`? - PullRequest
0 голосов
/ 01 мая 2020

У меня есть проект 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 будет приветствоваться!

...