I am working on a project where I have to customize bootstrap less files. I have figured out a way to do it with Mimosa using mainOverRide and copy exclude. But its pretty sloppy.
Here is the config
exports.config = {
"modules": [
"copy",
"jshint",
"csslint",
"require",
"minify-js",
"minify-css",
"live-reload",
"less",
"bower"
],
watch: {
sourceDir: "src",
compiledDir: "website",
javascriptDir: "js"
},
vendor: {
javascripts: "js/vendor",
stylesheets: "css/vendor"
},
bower: {
copy: {
mainOverrides: {
"bootstrap": [
"dist/js/bootstrap.js",
{"less":"bootstrap/less"},
{"less/mixins":"bootstrap/less/mixins"}
],
"font-awesome": [
{ "fonts": "fonts" },
"css/font-awesome.css",
"css/font-awesome-ie7.css"
]
},
exclude: ["css/vendor/bootstrap/less"]
}
}
}
This will copy the bootstrap less files into my css/vendor/bootstrap
Then what I do is put my custom less files into just the css directory ex: custom.less or variables.less. I then go and edit the bootstrap.less file to import my new custom less files.
So my question is.... is there a better way? I feel this is a bit sloppy. I feel as if I am missing out on a easier way to use custom bootstrap files using Mimosa.