Как повторно использовать угловые компоненты из разных папок проекта?

Question

У меня есть проект Angular, в котором у предыдущих разработчиков были скопированные / вставленные компоненты.

В этом проекте мобильное представление полностью отличается от представления рабочего стола, за исключением некоторых компонентов и тех компонентов, которые могут быть повторно использованы, они точно копируются / вставляются разработчиками. И даже файлы .ts различных представлений шаблонов также копируются / вставляются, что может быть использовано повторно.

Теперь у меня два вопроса

1. Если я сделаю общий модуль и повторно использую этот модуль на рабочем столе и мобильная папка это влияет на скорость / производительность приложения, так как есть более 50 компонентов, которые нуждаются быть готовым?
2. Это стандартное копирование / вставка кода, а не повторное использование этих components.?

Вы можете получить четкое представление о моем вопросе, увидев ссылку на прикрепленное изображение ниже. https://ibb.co/DgT4rwh

Answer 1

Мы должны следовать принципу СУХОГО кодирования. Вы должны создать общий модуль, содержащий дубликаты компонентов, которые будут использоваться другими модулями.

Answer 2

Ответ Виталия Боброва - правильный способ сделать это при повторном использовании модулей и компонентов в разных проектах. Но из этого скриншота видно, что они могут копировать / вставлять в одном проекте. Вы должны всегда объединять и повторно использовать модули / компоненты / сервисы. Единственное влияние, которое это окажет на скорость, будет уменьшение общего размера вашего приложения (меньше компонентов = меньше кода) и, как следствие, увеличение начального времени загрузки. Что касается # 2, то копирование / вставка кода никогда не бывает стандартным, и в моем опыте это является отличительной чертой неопытного разработчика.

Answer 3

Нельзя копировать / вставлять компоненты, для этого следует использовать общие модули или библиотеки, см. Документацию:

https://next.angular.io/guide/file-structure

https://next.angular.io/guide/libraries

https://next.angular.io/guide/styleguide