How to modify variables.less

archived đź—„
1

I am new to this system and less as well (since working with SASS) trying to understand how to setup and modify the system as per my need.

I am using Netbeans 7.2 on Ubuntu 12.04 and setup all required package (Note.js, Grunt, npm, less, sass, compass etc) Now I am trying to modify variables.less file but nothing happens. I know it is something wrong with my less coniguration or may be I need to activate watch similar like in compass stuffs for Less.

Can anyone guide what all I need to do to modify and update bootstraps core less files which can eventually modify theme’s main.min.css file?

Thanks a lot.

2

Are you using grunt to manually compile after an edit or grunt watch to automatically compile after every save?

3

Also see here. One thing to add to Tamara’s comment is that you need to run the commands from the root directory of your Roots theme i.e. where the Gruntfile.js resides.

4

You may also wish to use the sass version of Roots instead.

5

I have installed Grunt but I am new to it so no idea how to use it. Do I need to run the command in my terminal grunt watch same like compass? and it will automatically update all my less files?

I am sorry about so basic question but trying to understand how this works.

6

[quote=“Foxaii, post:3, topic:1346, full:true”]
Also see here.[/quote]

I have gone through it before I have posted my question here. However I am unable to find the answer how to modify bootstraps files.

[quote=“Foxaii, post:3, topic:1346, full:true”]
One thing to add to Tamara’s comment is that you need to run the commands from the root directory of your Roots theme i.e. where the Gruntfile.js resides.[/quote]
Yeah I thought so. You mean I need to set path of my Roots theme directory and run grunt watch command in terminal. Is that correct?

7

I have read somewhere here that it is not up to date. So I am afraid to use it.

9

I’m using it on a project; it’s working fine.

It looks like they only keep it up-to-date with tagged releases of Roots, not necessarily the master branch. The latest version of both is 6.5.2.

Either way, it’s not going to help you with your Grunt problem–the Sass version uses Grunt, too.

10

I see. So now just trying to fix the issue using Grunt.

11

Yep! There’s a post in the docs about modifying Bootstrap; it links to the Grunt guide, as well. But once you have npm install everything, you should just open a terminal, cd into /your/theme/dir, and do grunt watch. It’ll recompile your files whenever you save changes.

It’s a lot to learn, but it’s well worth the effort.

12

Okay this is sounds cool and promising. Let me try and see.

13

I have tried and getting below error.

grunt-cli: The grunt command line interface. (v0.1.13)

Fatal error: Unable to find local grunt.

If you're seeing this message, either a Gruntfile wasn't found or grunt
hasn't been installed locally to your project. For more information about
installing and configuring grunt, please see the Getting Started guide:

http://gruntjs.com/getting-started

Just wonder if I have to install in the theme directory again? http://stackoverflow.com/questions/18114666/grunt-fatal-error-unable-to-find-local-grunt-in-yeoman

14

Okay cool. It is working now… :slight_smile: just one last question related to this one is do I need to compile anything to deploy to the production?

15

Your “grunt watch” or “grunt dev” commands should be compiling everything for production right there for you! Your main.min.css is production ready!

16