Разница между модулями.меньше и больше.меньше
Есть ли какая-либо разница между расширением темы с помощью _module.less и _extend.less? И какова наилучшая практика при расширении модуля/темы?
Моей первой мыслью было, что лучше использовать _module.less при создании нового модуля и _extend.less при расширении модуля. Но Luma использует _module.less при расширении пустой темы, так что теория вылетела в окно.
Единственное различие, которое я вижу между ними, заключается в том, что _module.less импортируется до отзывчивой библиотеки и _theme.less где as _extend.less импортируется после них.
Это порядок, в котором они импортируются vendor/magento/theme-frontend-blank/web/css/styles-l.less
//
// Blank theme desktop styles
// _____________________________________________
// These desktop styles are added to mobile
//
// Global lib + theme styles
// ---------------------------------------------
@import '_styles.less';
@import (reference) 'source/_extends.less';
//
// Magento Import instructions
// ---------------------------------------------
//@magento_import 'source/_module.less'; // Theme modules
//@magento_import 'source/_widgets.less'; // Theme widgets
//
// Media queries collector
// ---------------------------------------------
@import 'source/lib/_responsive.less';
@media-target: 'desktop'; // Sets target device for this file
@media-common: false; // Sets not to output common styles
//
// Global variables override
// ---------------------------------------------
@import 'source/_theme.less';
//
// Extend for minor customisation
// ---------------------------------------------
//@magento_import 'source/_extend.less';
3 answers
Ответ несколько скрыт в документах Magento:
Расширение темы с помощью _extend.less - это самый простой вариант, когда вы довольны всем, что есть в родительской теме, но хотите добавить больше стилей.
Используйте _модуль.меньше, если вы хотите внести существенные изменения в стили для модуля и использовать _extend.меньше для незначительных корректировок. Вы найдете больше примеров того, как переопределять стили компонентов в ссылка выше.
Простое объяснение или различие между ними:
_extend.less это способ расширения/изменения стилей родительских тем например, вы довольны своей родительской темой Luma и просто хотите изменить стили кнопок в своей пользовательской теме, все, что вам нужно сделать, это создать новый файл _buttons_extend.less в разделе web/css/source в своей пользовательской теме и настроить стили там. Зарегистрируйте этот файл, добавив его в файл _extend.less в каталоге вашей темы.
Что делать, если вы хотите расширить стили модуль, например, модуль оформления заказа, ну, вы можете создать файл _extend.less в папке модуля тем, например, Magento_Checkout/web/css/source/_extend.less и добавить/расширить стиль модуля там.
Теперь, если я добавил файл _module.less в свой каталог модулей Magento_Checkout/web/css/source/_module.less, я намерен переопределить стиль родительских тем для этого модуля, и в этом случае мне нужно скопировать файл "_module.less" из каталога модулей моей родительской темы и внести изменения в этот файл, и в этом случае этот файл полностью заменит файл родительских тем _module.less.
_extends.less с буквой S в конце пустой темы - это файл, в котором они создали все классы, которые могут быть расширены с помощью LESS позже в рамках темы, без необходимости создания новых компонентов или модульной структуры для изменения стиля. -> Для тех, кто мне не верит: https://github.com/magento/magento2/blob/2.3-develop/app/design/frontend/Magento/blank/web/css/source/_extends.less{[7] } проверьте файл.
_extend.less без буквы S в конце - это для тех случаев, когда вам 99% доволен тем, что есть в родительской теме, и вам просто нужно изменить пару вещей, изменить стиль, и все.
Что касается последнего, мое личное мнение, не используйте его для собственного развития. Позже это создает большой беспорядок. Сохраняйте свою структуру модульной с помощью _module.less для каждого модуля, который вы хотите настроить, и в конце вы получите лучший результат и поддерживаемый проект.