Я собрал библиотеку компонентов и использую Webpack для объединения всех файлов TS, TSX и S css в один большой главный файл. js. Кроме того, я использую TS c для создания файлов определения TypeScript (.d.ts) для моих компонентов. Моя структура компонентов выглядит следующим образом (упрощенно):
- ComponentA
- ComponentA.s css
- ComponentA.tsx
- ComponentB ...
Теперь, когда библиотека растет, я хочу разделить код, чтобы можно было импортировать только определенные c компоненты. Это было довольно легко, используя Webpack и несколько точек входа, по одной для каждого Компонента, а Webpack также создает общие. js -Чанк для всего кода, совместно используемого несколькими компонентами.
Проблема в том, что ts c генерирует файлы .d.ts, не зная о выходных данных Webpack, поэтому сохраняет первоначальную структуру папок. Мой вывод выглядит примерно так:
- ComponentA. js
- ComponentB. js
- commons. js
- ComponentA
- ComponentB
Таким образом, если компонент импортируется в проект TS, файлы определения не найдены. Конечно, я мог бы скопировать все файлы d.ts в папку root, но тогда все импорта также пришлось исправить. Я также мог настроить Webpack для сохранения исходной структуры папок, но затем компоненты пришлось импортировать так:
import {ComponentA} from 'mylibrary/components/ComponentA/ComponentA'
, что довольно трудоемко.
Существует ли элегантное решение для "синхронизации" вывода веб-пакета и файлов определения машинописного текста? Или я делаю что-то в корне неправильно?