LESS compilation (Grunt) or cache issue

Question

I have started using Grunt, but encountered an issue. I am trying to change styles in custom theme via one of the LESS files, but nothing happens. It worked once, but it doesn't now, and I don't know why.

Task: change _grid-col.less
Result expected: style change on front-end.
Current result: style changes on front-end from an earlier customization (but not from the last).

Here's what I've tried:

• Set Magento Dev mode;
• clear directories var/di/, var/generation/, /var/view_preprocessed/, , /pub/static/frontend/Codazon/
• flush cache
• change _grid-col.less
• grunt clean:outdoor
• grunt exec:outdoor
• grunt less:outdoor --force (force because the theme has some errors. That didn't prevent it from working earlier...)

Also, I tried:
- setup:static-content:deploy --theme Codazon/fastest_outdoor lt_LT en_GB
- clear browser cache

Here is my themes.js file for Grunt:

    module.exports = {
    outdoorlt: {
       area: 'frontend',
        name: 'Codazon/fastest_outdoor',
        locale: 'lt_LT',
        files: [
            'css/source/_theme',
            'css/source/_variables',
            'css/source/layout/_blocksidebar',
            'css/source/layout/_footer',
            'css/source/layout/_header',
            'css/source/layout/_slider',
            'css/source/layout/_homestore',
            'css/email-fonts',
          'css/source/components/_modals_extend',
            'css/source/_sources'
        ],
        dsl: 'less'
    },
    outdoor: {
       area: 'frontend',
        name: 'Codazon/fastest_outdoor',
        locale: 'en_GB',
        files: [
            'css/source/_theme',
            'css/source/_variables',
            'css/source/layout/_blocksidebar',
            'css/source/layout/_footer',
            'css/source/layout/_header',
            'css/source/layout/_slider',
            'css/source/layout/_homestore',
            'css/email-fonts',
            'css/source/components/_modals_extend',
            'css/source/_sources'
        ],
        dsl: 'less'
    }
};

'css/email-fonts', 'css/source/components/_modals_extend', 'css/source/_sources' are from parent theme. _grid-col.less is imported via _sources.less

I recently changed the workflow to client-side, but that didn't help.

Answer 1

Finally, I found that it was Varnish what stopped from cleaning cache. When my webserver started using more hosts, Varnish purge wouldn't work with Magento flush. I had to change some settings in default.vcl. In my case, I added set req.http.host = "outpro.lt";

More details https://stackoverflow.com/questions/3334023/configure-multiple-sites-with-varnish

In addition, I have changed Varnish settings in Magento, default.vcl and /etc/sysconfig/varnish host or listen address (according to file) to my host instead of IP.

UPDATE

It does not work as supposed to.. Anyway, running command service varnish restart always cleans the cache.

Answer 2

try the following:

The first you could try

1. go to the backend under system-> cache management
2. under additional cache management (the last section of this site) you have the point with the explaination: Themes JavaScript and CSS files combined to one file.
3. press the button

4. use the cpmposer with the compile commands

   • -d memory_limit=-1 bin/magento setup:static-content:deploy en_US

   • bin/magento index:reindex

   • bin/magento cache:clean

The second you could try

use the cpmposer with the compile commands

• -d memory_limit=-1 bin/magento setup:di:compile
• -d memory_limit=-1 bin/magento setup:static-content:deploy en_US
• bin/magento index:reindex
• bin/magento cache:clean