Руководство по стилю Angular описывает эти три типа модулей, но когда я читал документацию, я был настолько сбит с толку, что не помню, сколько раз я сказал WTFF !!
После некоторых исследований в Интернете я так и не понял разницы между CoreModule и SharedModule. FeatureModule был для меня наиболее очевидным, потому что я привык писать функциональные модули. Но двое других были для меня такими двусмысленными, пока я не начал играть с ними и экспериментировать с ними обоими.
Итак, что такое CoreModule и SharedModule и как их использовать?
Основной модуль или модуль основных функций
Основной модуль - это модуль, который импортируется только один раз в AppModule и никогда не импортируется снова в другие модули. Чтобы ваш модуль был импортирован только один раз (если вы работаете в команде подлых членов), вы можете поместить этот код в конструктор класса, который предотвратит импорт модуля дважды:
Так почему же нам нужно импортировать этот знаменитый модуль только один раз? Причина этого в том, что мы хотим, чтобы все, что находится внутри основного модуля, было синглтоном !!! И это очень важно, если вам нужно, чтобы у ваших компонентов / сервисов был только один экземпляр. Некоторыми примерами использования являются служба профилей или компоненты верхнего или нижнего колонтитула.
Общий модуль или модуль общих функций
SharedModule в отличие от CoreModule импортируется в каждый функциональный модуль, которому требуются некоторые общие компоненты.
Рекомендуется избегать использования служб в SharedModule, потому что в конечном итоге у вас будет много экземпляров этой службы.
SharedModule - идеальное место для импорта и экспорта ваших UI-модулей или компонентов, которые часто используются в вашем приложении. Это сделает ваш код более читаемым и поддерживаемым. Хорошими примерами использования SharedModule являются импорт и экспорт модулей Angular Material и / или модуля Flex Layout. Сделав это, вам нужно только импортировать SharedModule в свой функциональный модуль и вуаля !! Все ваши импортированные модули / компоненты Angular Material доступны, а блок импорта поверх вашего файла намного меньше.
Заключение
Я до сих пор помню разочарование из-за того, что не смог получить четкое представление о том, что это за два модуля, поэтому сейчас я делюсь с вами этими лучшими практиками Angular. Не стесняйтесь спрашивать меня о чем угодно в разделе комментариев, если что-то все еще остается для вас неоднозначным, и наслаждайтесь путешествием по Angular!
Если вам понравился этот рассказ, посмотрите мой другой Лучшие практики Angular: как импортировать материалы Angular
