Magento 2 – Can’t Get Grunt Working

gruntjavascriptless

I can't get Grunt working on Magento 2. I'm going through the devdocs and have run the following commands to set up grunt:

$ sudo npm install -g grunt-cli
/usr/bin/grunt -> /usr/lib/node_modules/grunt-cli/bin/grunt
/usr/lib
└── grunt-cli@1.2.0 

$ sudo npm install
$ sudo npm update
$ grunt watch
Running "watch" task
Waiting...
^C

Execution Time (2017-03-20 17:24:18 UTC-0)
Total 2m 47.1s

$ grunt clean:nova
Running "clean:nova" (clean) task
>> 0 paths cleaned.

Done, without errors.


Execution Time (2017-03-20 17:27:07 UTC-0)
loading tasks  749ms  ▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ 97%
clean:nova      14ms  ▇▇▇ 2%
Total 769ms

$ 

grunt watch does nothing, it just says waiting.... And while grunt clean seems to work, I'm not sure how I can verify this.

Of course I edited on of my theme's less files…
app/design/frontend/Holy/nova/web/css/source/_extend.less

I have magento2 running in a vagrant box on my OSX host. I've tried running grunt on both the vagrant box & OSX host without success on either.

However, the server side less compilation is working, it was before I tried to try grunt. I can see my less changes take effect once I clear the cache with:

php bin/magento cache:clean; php bin/magento cache:flush; rm -rf pub/static/frontend/Monsoon/nova/en_IE/ ; rm -rf var/view_pre

processed/

I'm not sure what the advantage is with using grunt in my workflow if the server compiles the less files. Just trying to get a grip of Magento2.

Best Answer

It appears to be working.

grunt clean will clean (and remove) the old css/less files and grunt compile will compile the css to less and then grunt watch will run in the background - updating your css/less as you make changes and save.

My normal routine is grunt exec static:content-deploy grunt clean grunt watch

Related Topic