Как я могу настроить Bootstrap, не теряя изменений?

вы можете создать variables-custom.less и импортировать его в theme.less следующим образом:

//
// Load core variables and mixins
// --------------------------------------------------

@import "variables.less";
//import custom-variables after variables so the values will override.
@import "custom-variables.less"; //only has variables that have changed.
@import "mixins.less";

IMO, это немного лучше, чем первое решение, потому что вам не придется загружать два (почти) одинаковых файла CSS на клиенте.

Извините, я не могу помочь вам с тем, что нужно сказать о Bower и вашем системе управления версиями, так как я не использую Bower.

Вот решение, которое сработало для меня:

• Используйте bower для установки всех пакетов пользовательского интерфейса, например. bower install bootstrap chosen
• Создайте отдельную папку less, содержащую все LESS-модификации. Эта статья оказалась очень полезной здесь.

Вот мой файл less/styles.less:

@import "../bower_components/bootstrap/less/bootstrap.less";
@import "../bower_components/bootstrap-chosen/bootstrap-chosen.less";

//My custom variables - overrides the bootstrap variables file
@import "variables-custom.less";

• Используйте grunt для отслеживания изменений в папке less и компилируйте их в .css

Вот мой Gruntfile.js (благодаря этому ответу):

module.exports = function(grunt) {
    grunt.initConfig({
        less: {
            development: {
                options: {
                    paths: ["./less"],
                    yuicompress: true
                },
                files: {
                    "./static/css/styles.css": "./less/styles.less"
                }
            }
        },
        watch: {
            files: "./less/*",
            tasks: ["less"]
        }
    });
    grunt.loadNpmTasks('grunt-contrib-less');
    grunt.loadNpmTasks('grunt-contrib-watch');
};

Это действительно лучший метод настройки. Вы создаете theme.less и загружаете исходные файлы Bootstrap (которые могут быть обновлены в будущем), и в том же файле вы вызываете свои собственные переопределения. Либо вы @импортируете их из пользовательского файла, которого нет в каталоге Bower, либо вы просто пишете свои собственные правила в самой теме.less. Вы найдете объяснение этой техники в этот учебник.

С Grunt пользовательские настройки могут быть сложными. Но с Brunch это проще простого (да!) и все в значительной степени происходит автоматически. Твоя бабушка могла это сделать.

Что касается того, чтобы избежать включения bower_components в систему управления версиями: с Git это легко. Вы просто регистрируете свой bower.json, но обязательно добавляете /bower_components в свой файл .gitignore.

Вы должны просто создать свою собственную таблицу стилей, использовать обе с вашей пользовательской таблицей во вторую очередь. Таким образом, вы можете вносить изменения, но не менять загрузчик вообще.

Кроме того, когда вы обновляете, вы сохраняете свою таблицу стилей прежней.

Это позволяет вам изменять биты и части Bootstrap, но фактически не изменяя файл, вы переопределяете его.

Чтобы было ясно, ваш второй файл CSS будет ЗНАЧИТЕЛЬНО меньше... В него помещаются только те вещи, которые вам нужно изменить.