0

I am using grunt tool for magento server-side less preprocessing.

I have created _extend.less file following directory structure for my custom less compilation

app\design\frontend\Vendorname\themename\web\css\source\ _extend.less

After all necessary configurations of grunt I managed to compile my own less files with the grunt command 

grunt less:themename

Now everything works perfectly except when I am trying to add new .less file into _extend.less through @import directive grunt doesn't publish it's symlinks to

pub\static\frontend\Vendorname\themename\en_US\css

For example after I import _custom_button.less in _extend.less with

@import '_custom_button.less';

Now everytime I add new files with @import I have to run the commands.

grunt clean:themename
grunt exec:themename

So this workflow is conflicting when working with developers as it cleans everything in pub\static\frontend\Magento\themename\en_US directory.So that is the problem.I don't want to run clean command again.

Can I do anything for that?

Improve this question
3
  • No need to use clean and exec command every-time, have you tried grunt watch?
    – Ruhani
    Jun 6, 2018 at 10:58
  • Grunt watch is working actually.The problem is that in default styles-l.less file we import _extend.less later through //@magento_import directive and that's why _module.less can not get our own _extend.less file variable because it gets _module.less file from each and every module.
    – Shashank Bhatt
    Jun 6, 2018 at 11:13
  • See blank theme styles-l.less file in which you will find //@magento_import 'source/_extend.less'; at last.
    – Shashank Bhatt
    Jun 6, 2018 at 11:14

1 Answer 1

Reset to default
0

Try to below code for add your own less file:

You can create new less file for your theme

/app/design/frontend/Vendor/shop1/web/css/source/_custom_button.less

Override below file in your theme

/vendor/magento/theme-frontend-blank/web/css/source/_sources.less

Import your less file in source.less

/app/design/frontend/Vendor/YourTheme/web/css/source/_sources.less

Like this @import '_custom_button.less';

Improve this answer
4
  • Hello hweb87, thanks for your answer but this is not what I am looking for.Actually problem is that every time I import new less fie in web directory, I had to relaunch grunt clean and grunt exec command otherwise all idea of combining all files in pub folder (which is recommanded way) with grunt will not work.
    – Shashank Bhatt
    Jun 14, 2018 at 5:26
  • @ShashankBhatt for above solution you no need to run every time grunt clean and grunt exec command. just run grunt watch. please try once above way.
    – Hitesh Koshti
    Jun 14, 2018 at 5:29
  • After confirming with deveopers I came to know that even I can rerun grunt clean command and they don't mind with it as they no longer have to do anything in pub/static folder until I have not put my files in app directory. So after static content deploy I can regain all files.
    – Shashank Bhatt
    Jun 14, 2018 at 5:29
  • As per your solution, it doesn't work because symlink of newly added file to app/design will not published to pub/static/frontend/magento/theme/web/cdd/source/ path automatically. Grunt will always look for file in this directory and not in app directory.To publish symlink we must run exec command.
    – Shashank Bhatt
    Jun 27, 2018 at 7:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.