рабочий процесс интерфейса (Ворчание) соответствует бэкенду php (Symfony2-Twig)

Я интерфейсный парень, я использую Grunt (cssmin, меньше компиляции, уродство, загрузка печени, уменьшение изображения, просмотр, ворсинка...), и я начал работать с бэкэндом, который использует Symfony (шаблоны веток, средства для большинства задач, которые я выполняю с помощью Grunt...)

Мы используем своего рода шаблон "Модель-представление-модель" (извините, я не эксперт по бэкэнду).

Проблема в том, чтобы найти правильный рабочий процесс для нас обоих.
Я бы хотел остаться с Grunt, так как сейчас это лучшее для фронт-энда, я думать.

Мой обычный рабочий процесс заключается в запуске веб-сервера Grunt на локальном хосте:9000 и кодировании с нагрузкой на печень, без компиляции.
Когда я закончу, я смогу использовать "сборку с ворчанием" для выполнения "производственных" задач (сокращение, уродство, сжатие изображений...)

Проблема связана с шаблонами Php и Twig, я не могу использовать grunt и запускать веб-сервер для Php, и я не могу отображать шаблоны с помощью twig.js потому что это не то, что мы используем в производстве.
Также нам приходится иметь дело с Symfony2 серверная часть фреймворка.

Для загружаемой части я использую автономный плагин, но отслеживаю файлы и перезагружаю страницу, но, например, компиляция less не работает, так как Lessphp не полностью совместим с загрузкой Twitter (фреймворк, который я использую на интерфейсе)

У вас есть какие-нибудь предложения? Я могу добавить детали на всякий случай.

Я бы предпочел оставаться с Грантом как можно дольше, но я могу подумать об использовании активов, если он выполнит все ту же задачу или другое решение.

Это мой настоящий файл с ворчанием.js, когда я работаю только на интерфейсе:

var LIVERELOAD_PORT = 35729;
var lrSnippet = require('connect-livereload')({
    port: LIVERELOAD_PORT
});
var mountFolder = function(connect, dir) {
    return connect.static(require('path').resolve(dir));
};

module.exports = function(grunt) {    
    pkg: grunt.file.readJSON('package.json'),

                src: 'src',
        app: 'app',
        assets: '<%= project.app %>/assets',
        css: [
            '<%= project.src %>/less/bootstrap.less'
        ],
        js: [
            '<%= project.src %>/js/*.js'
        ]
    },

    connect: {
        options: {
            port: 9000,
            hostname: '*'
        },
        livereload: {
            options: {
                middleware: function(connect) {
                    return [lrSnippet, mountFolder(connect, 'app')];
                }
            }
        }
    },

    concat: {
        dev: {
            files: {
                '<%= project.assets %>/js/scripts.min.js': '<%= project.js %>'
            }
        },
        options: {
            stripBanners: true,
            nonull: true,
            banner: '<%= tag.banner %>'
        }
    },

    uglify: {
        options: {
            banner: "<%= tag.banner %>"
        },
        dist: {
            files: {
                '<%= project.assets %>/js/scripts.min.js': '<%= project.js %>'
            }
        }
    },

    less: {
        dev: {
            files: {
                '<%= project.assets %>/css/style.min.css': '<%= project.css %>'
            }
        },
        dist: {
            options: {
                cleancss: true
            },
            files: {
                '<%= project.assets %>/css/style.min.css': '<%= project.css %>'
            }
        }
    },

    imagemin: { // Task
        dynamic: { // Another target
            files: [{
                expand: true, // Enable dynamic expansion
                cwd: '<%= project.src %>/img', // Src matches are relative to this path
                src: ['**/*.{png,jpg,gif}'], // Actual patterns to match
                dest: '<%= project.assets %>/img' // Destination path prefix
            }]
        }
    },

    open: {
        server: {
            path: 'http://localhost:<%= connect.options.port %>'
        }
    },

    watch: {
        concat: {
            files: '<%= project.src %>/js/{,*/}*.js',
            tasks: ['concat:dev', 'jshint']
        },
        less: {
            files: '<%= project.src %>/less/{,*/}*.less',
            tasks: ['less:dev']
        },
        livereload: {
            options: {
                livereload: LIVERELOAD_PORT
            },
            files: [
                '<%= project.app %>/{,*/}*.html',
                '<%= project.assets %>/css/*.css',
                '<%= project.assets %>/js/{,*/}*.js',
                '<%= project.assets %>/{,*/}*.{png,jpg,jpeg,gif,webp,svg}'
            ]
        }
    }
};

grunt.registerTask('default', [
    'less:dev',
    'concat:dev',
    'connect:livereload',
    'open',
    'watch'
]);

grunt.registerTask('build', [
    'less:dist',
    'uglify',
    'imagemin'
]);