Grunt watch command

sage
1

I’ve been unable to work with the grunt watch command after having reviewed tutorial. When I go to run ‘grunt watch’ everything seems to be working fine but when making changes to ANY files in the LESS folders nothing happens in the terminal. I would expect that it means I’m ‘watching’ the wrong directory but swear its in the right one. Anything else that could be going wrong?

Here is what I get in the terminal when running grunt

Jeffs-MacBook-Air:~ jeffsee55$ cd Documents/sites/wordpress2/wp-content/themes/roots-master
Jeffs-MacBook-Air:roots-master jeffsee55$ grunt
Running “clean:dist” (clean) task
Cleaning assets/css/main.min.css…OK
Cleaning assets/js/scripts.min.js…OK

Running “less:dist” (less) task
File assets/css/main.min.css created.

Running “uglify:dist” (uglify) task
File “assets/js/scripts.min.js” created.

Running “version” task
Versioning assets/css/main.min.css…OK
Versioning assets/js/scripts.min.js…OK
“lib/scripts.php” updated with new CSS/JS versions.

Done, without errors.
Jeffs-MacBook-Air:roots-master jeffsee55$ grunt watch
Running “watch” task
Waiting…

2

Where’s the file that you’re editing?

By default, the Roots Gruntfile is only watching the assets/less/ root and the Bootstrap folder:

3

I am editing the app.less file located in assets/less/, watching the tutorial video and the only difference I had from everything in it was that I had to enter sudo before ‘npm install -g grunt-cli’. Also I noticed a difference in my gruntfile from the one in the video

Mine downloaded from roots -

less: {
dist: {
files: {
‘assets/css/main.min.css’: [
‘assets/less/app.less’
]
},
options: {
compress: true,
// LESS source map
// To enable, set sourceMap to true and update sourceMapRootpath based on your install
sourceMap: false,
sourceMapFilename: ‘assets/css/main.min.css.map’,
sourceMapRootpath: ‘/app/themes/roots/’
}
}

Gruntfile.js from tutorial video -

recess: {
dist: {
options: {
compile: true,
compress: true
},
files:{
‘assets/css/main.min.css’: [
‘assets/less/app.less’
]

… and so on

Any reason they are different? New to LESS and Grunt so trying to make sense of it all still.

Thanks for your response

4

There have been updates to the Gruntfile since the video was recorded, specifically the source maps.

Can you edit the .less file and post the output of the terminal?

You might also try git cloning a brand new roots theme, change the background to black or something obvious, and see if it works. If it does, then there’s an issue specifically with the theme you’re working on. If it doesn’t work, then you have an issue with your computer setup.

5

I do think it is an issue with the computer setup, I simply tried to change the background in the app.less file to see if grunt was properly compiling everything. This was a fresh roots starter theme install so I’m confident that there’s nothing wrong with the theme.

As for the terminal output thats just the problem, nothing happens. I run the command ‘grunt watch’ and then go ahead and change the app.less file (something like body {background: black;}) or the variables.less file (to something equally simple) - hit save and the terminal doesnt budge from the following:

Jeffs-MacBook-Air:roots-master jeffsee55$ grunt watch
Running “watch” task
Waiting…

6

I’m having this problem too.

I had grunt working just fine for the last 3-4 projects using the Roots Sass theme.

Now I switched to LESS, and grunt watch doesn’t work for me. However, running grunt compiles everything and works just fine. Not sure why grunt watch isn’t working.

7

Disregard the last sentence of this post in your case: How to correctly add bxslider to my theme