Предположим, у нас есть приложение и библиотека в Nrwl Nx
.
/apps
/myApp
/libs
/myLib
/components
/my.component.ts
/other.component.ts
/index.ts
Я уже установил теги в правилах nx.json
и nx-enforce-module-boundaries
, чтобы заблокировать импорт приложения внутри библиотеки. Это работает, и с этой частью все в порядке.
Еще одна вещь, которую я хотел сделать, это принудительное использование файлов бочек в библиотеках. Поэтому я создал путь в tsconfig.ts
"paths": {
"@myNs/my-lib": ["libs/myLib/index.ts"]
}
Я столкнулся с проблемой. Предположим, у нас есть что-то, экспортированное из index.ts
.
// index.ts
export { MyComponent } from './components/my.component';
Теперь, если мы используем некоторую функцию автоимпорта IDE (например, из WebStorm
или VS Code
). Они будут импортировать MyComponent
, используя путь @myNs/my-lib
- и это ожидается, потому что я только что настроил это так.
Реальная проблема возникает, когда я хочу что-то автоматически импортировать внутри myLib
(эти импорт должен быть относительным, а не @myNs/my-lib
) - согласно logi c и этой статье ( [Интересная статья здесь] ):
Никогда не позволяйте библиотеке импорт из собственного файла Barrel
Модули TypeScript внутри конкретной библиотеки не должны заботиться о том, какие функции предоставляет библиотека, поэтому в любой момент ей не следует использовать собственный файл барреля.
Если модуль импортирует что-то из своего собственного файла барреля, это почти всегда приводит к ошибкам циклической ссылки. Поэтому при импорте изнутри модуля следует использовать относительный импорт пути.
Поэтому я нашел обходной путь, чтобы заблокировать TS-образный импорт внутри lib. Я добавил правило внутри libs/myLib/tslint.json
:
"rules": {
"import-blacklist": [true, "@myNs/my-lib"]
}
В любом случае, оно не исправляет функцию автоматического импорта, просто запрещает использовать неправильный импорт внутри библиотеки.
Другая проблема заключается в том, что есть все еще неправильный импорт разрешен. Предположим, что OtherComponent
хочет импортировать MyComponent
Тогда есть три возможности:
import { MyComponent } from './my.component'; // the correct way
import { MyComponent } from '.'; // not the best, but also the correct way
import { MyComponent } from '..'; // using barrel file - not correct (look at the citation above), but still successfuly validated by TSLint
Вопросы:
- Как запретить импорт файлов бочек внутри той же библиотеки?
- Как настроить IDE для использования относительных путей внутри путей lib и TypeScript снаружи (
@myNs/my-lib
)?