What is the best way to customize a Bootstrap-less file in Mimosa?

Question

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.

Answer 1

Few options:

• If the updates you have to make are minor, then you can introduce a build step to perform your modifications. You can use adhoc-modules to process the file as it comes through and modify it. Here's a module that modifies d3 during the build: https://github.com/dbashford/mimosa-d3-on-window, using this approach lets you keep the vendor library pristine while introducing a repeatable build step that performs your modification for you.

• If you need to update the less files in a major way, you may be better off not using Bower and just have the code live in your repo outside of Bower. With your modifications, you will obviously have issues running and re-running Bower and having that override the customizations you've made.