The biggest dilemma I face before every project is whether I need to use the whole of Bootstrap or just the required parts of it. I wasted a lot of time deciding on this.
My setups so far have been like this:
Copy the less directory from twitter/bootstrap to my stylesheets directory
├── bootstrap
│ ├── layouts.less
│ └── more...
├── fonts.less
├── mixins.less
├── mysite.less
├── plugins.less
└── variables.less
Create a plugins.less file to include required bootstrap less files. It will look like this:
@import "bootstrap/layouts.less";
@import "bootstrap/type.less";
@import "bootstrap/forms.less";
@import "bootstrap/buttons.less";
@import "bootstrap/utilities.less";
Then, use this plugins.less inside my main.less file.
@import "fonts.less"
@import "variables.less" // Bootstrap's + my variables
@import "mixins.less" // Bootstrap's + my mixins
@import "plugins.less"
@import "mysite.less"
From the blog posts and discussions I have seen, it looks like most people just include bootstrap.css, bootstrap-responsive.css and overwrite styles with custom.css. While I understand that this will minimize the “bootstrap”ping time of a project, I worry about bloat and maintenance. When I use this method, I see, through the Inspector, hundreds of styles being overridden. Also, I may accidentally use a class name used by bootstrap.
Are there any disadvantages to the method I use? Or should I just use http://twitter.github.com/bootstrap/customize.html and override some classes in custom.less?
Personally I include the less files required for my project and then customize the given classes to do what I need. If I need to add custom classes, I do it in custom.less.
Each project is different though, so make Bootstrap work for you. Is the site going to be maintained for many years? Perhaps you want to take the time to remove unused less files and modify existing classes to do what you need. If the project needs to be done quickly and perhaps the site will be short lived, just include all the .less file and overwrite in custom.less
It might also be useful to know that in Bootstrap version 3, all of the less will be in one file http://blog.getbootstrap.com/2012/12/10/bootstrap-3-plans/. Personally I like working with one large file instead of working with many .less files.