How do you use less inside custom module
how do I include and compile?
Magento Stack Exchange is a question and answer site for users of the Magento e-Commerce platform. It only takes a minute to sign up.Sign up to join this community
You need to upgrade the source to include the @import command in the style-l.less file with:-
php bin/magento setup:upgrade
Then you need to deploy static content to compile your less files with:-
php bin/magento setup:static-content:deploy
Also by convention the file should be named:-
I searched all Magento modules for
.less files, and found none, which suggests to me that LESS is reserved to themes, and not modules.
You CAN write
CSS for your module, however. I found an example in
<head> <css src="Magento_Swatches::css/swatches.css"/> </head>
You can add it by giving the naming as "_module.less" at below path, Magento will include it by default and you don't need to code anywhere to call it:
For more details about less and extending the core less files (using _extend.less), you can visit the below link: https://devdocs.magento.com/guides/v2.4/frontend-dev-guide/css-guide/css_quick_guide_approach.html
From the Magento frontend developer guide:
"In the Magento application, the recommended way to include stylesheets is to specify them in layout files.
Usually, the stylesheets you include should be available for all store pages. To achieve this, include your CSS in default_head_blocks.xml of the Magento_Theme module, which defines the default page section for all Magento pages. The recommended way to do this is adding an extending default_head_blocks.xml in your theme, and including the required stylesheets in this file.
You can find more details here: