Запретить импорт файла барреля в той же библиотеке в Nrwl Nx - PullRequest
2 голосов
/ 12 февраля 2020

Предположим, у нас есть приложение и библиотека в 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

Вопросы:

  1. Как запретить импорт файлов бочек внутри той же библиотеки?
  2. Как настроить IDE для использования относительных путей внутри путей lib и TypeScript снаружи (@myNs/my-lib)?

Ответы [ 2 ]

2 голосов
/ 22 апреля 2020

Вот настройка в IntelliJ. Я правильно вижу эту работу в v2020.1.

image Code Style > Typescript named "Use path mappings from tsconfig.json set to "Only in files outside specified paths"">

Мне нравится, однако, созданное @Nickson правило, и я думаю, что это хорошая идея добавить в предотвратить ошибки!

1 голос
/ 24 февраля 2020

Никто не ответил, поэтому я решил создать простое TSLint правило для этого случая: import-blacklist-extended

Правило отлично работает в Nrwl monorepo, но это может быть оптимизировано, и некоторые механизмы могут быть решены лучше. Не стесняйтесь создавать вопросы и PR на Github, если вам нужны какие-либо изменения.

...