Question

I create a custom.less file. Which files I should import (@import) to start working with Bootstrap?

How to get started with Bootstrap and LESS?? I can’t find any tutorials…

Answer 1

Here is my suggestion, before you kill yourself trying to get LESS to compile with Bootstrap, just set that folder aside for a bit and create a test project to get LESS working. Start like this:

1. Download and install node
2. Create a folder called something like “less-build” just to get this working
3. In windows, shift + right click (not sure what mac is) and select “open command window here”. Type npm install less -g and hit enter to install LESS “globally” on your computer
4. Now type “npm install less” to install LESS “locally”. If all is well you should see a folder called “node_modules” inside the less-build folder. If you click into node_modules you will see a folder for less.
5. Next, in the less-build folder create a file called styles.less. Inside that file add the following code:

@backgroundColor: #900;

.block {
  background: @backgroundColor;
}

1. Save the file, close it.
2. Now, again in the command prompt type the following:

lessc --compile styles.less > styles.css

1. If all is well you should see the file styles.css. Open it and confirm that there is valid css in the file.

If that works, open the Bootstrap folder and find the less folder, you’ll find a file called bootstrap.less. Use the process I described on bootstrap.less. This should give you a head start.