Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[react-ui] Про относительные пути, индекс файлы и авто импорт IF-634 #2716

Open
JackUait opened this issue Jan 14, 2022 · 3 comments

Comments

@JackUait
Copy link
Contributor

Есть несколько проблем с импортом компонентов:

  1. Папки с компонентами и сущностями (такие как internal, components, lib и другие) не имеют index файлов, из-за чего импорты из них зачастую разрастаются и превращаются в нечто подобное:
import { isTestEnv } from '../lib/currentEnvironment';
import { ThemeContext } from '../lib/theming/ThemeContext';

import { FLAT_THEME_OLD } from '../lib/theming/themes/FlatThemeOld';
import { FLAT_THEME } from '../lib/theming/themes/FlatTheme';
import { DEFAULT_THEME_OLD } from '../lib/theming/themes/DefaultThemeOld';
import { DEFAULT_THEME } from '../lib/theming/themes/DefaultTheme';

Вместо чего-то подобного:

import { isTestEnv } from '../lib';
import { ThemeContext } from '../lib/theming';

import { FLAT_THEME, FLAT_THEME_OLD, DEFAULT_THEME_OLD, DEFAULT_THEME } from '../lib/theming/themes';

Из-за чего ухудшается читаемость импортов и разрастается сам файл.

  1. Часть компонентов не выделяет сущности в отдельные папки, из-за чего происходит следующее:
import { Selection, SelectionDirection, SelectionHelper } from './SelectionHelper';
import { CurrencyHelper } from './CurrencyHelper';
import { CurrencyInputHelper } from './CurrencyInputHelper';

Хотя правильнее:

import { Selection, SelectionDirection, SelectionHelper, CurrencyHelper, CurrencyInputHelper } from './helpers'
  1. Так как в tsconfig baseUrl задан для всех проектов как ./packages. Это приводит к "багу" при авто импорте: путь до файла прописывается относительно директории packages, а не относительно директории текущего проекта, из за чего мы получаем 'react-ui/internal/Calendar/config' который не будет распознан проектом корректно и выкинет ошибку, вместо 'internal/Calendar/config' который будет корректно отрабатывать.
  2. Из-за некорректного baseUrl также возникает ещё одна проблема: нет возможности прописывать абсолютные импорты, из-за чего мы получаем:
import { CustomComboBoxLocaleHelper } from '../../../internal/CustomComboBox/locale';
import { LangCodes, LocaleContext } from '../../../lib/locale';
import { defaultLangCode } from '../../../lib/locale/constants';
import { InputLikeText } from '../../../internal/InputLikeText';
import { MenuItem } from '../../MenuItem';
import { Menu } from '../../../internal/Menu';
import { delay } from '../../../lib/utils';

Вместо следующего (также внесены правки из первого пункта):

import { CustomComboBoxLocaleHelper, InputLikeText, Menu } from 'internal';
import { LangCodes, LocaleContext, defaultLangCode, delay } from 'lib';
import { MenuItem } from 'components';
@zhzz
Copy link
Member

zhzz commented Jan 14, 2022

  1. Пока не можем использовать индексы, потому что собираем библиотеку одновременно и в es6 и в cjs. С последним не работает тришейкинг, что потенциально приведет к разрастанию бандлов пользователей из-за библиотеки. Нужно сначала разобраться с IF-186.
  2. Предполагается все в одном файле держать? Чем это лучше?
  3. и 4. Звучит неплохо, но как предполагается это будет работать для собранного js? Насколько я понял, ts сам не меняет такие пути на корректные во время сборки.

@JackUait
Copy link
Contributor Author

  1. Нет, это не файл, а директория в папке компонента. Такая директория есть например у компонента DateInput.
  2. У бабеля есть специальный плагин который решает эту проблему. Storybook тоже не понимает абсолютные пути и ему о них тоже придётся рассказывать с помощью плагина.

@zhzz
Copy link
Member

zhzz commented Jan 17, 2022

Можно попробовать, ничего против не имею.

На счет конкретно lib есть еще одна задачка IF-215, которая тоже поможет с этой проблемой.

@dzekh dzekh changed the title Про относительные пути, индекс файлы и авто импорт [react-ui] Про относительные пути, индекс файлы и авто импорт Jul 21, 2022
@dzekh dzekh changed the title [react-ui] Про относительные пути, индекс файлы и авто импорт [react-ui] Про относительные пути, индекс файлы и авто импорт IF-634 Jul 21, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

No branches or pull requests

2 participants