我是前端人员，我使用 Grunt（cssmin、less 编译、uglify、livereload、image minify、watch、lint...），我开始与使用 Symfony（twig 模板、资产学）的后端人员合作对于我用 Grunt 完成的大部分任务......）
我们正在使用一种 Model-View-ViewModel 模式（对不起，我不是后端专家）。
问题是为我们双方找到合适的工作流程。
我想留在 Grunt，因为我认为它现在最适合前端。
我通常的工作流程是在 localhost:9000 启动 Grunt 网络服务器并使用 livereload 进行编码，从而减少编译。
完成后，我可以使用“Grunt build”来执行“生产”任务（缩小、丑化、图像压缩......）
问题来自于 Php 和 Twig 模板，我不能使用 grunt 并为 Php 启动一个网络服务器，也不能用 twig.js 渲染模板，因为它不是我们在生产中使用的。
我们还必须在服务器端处理 Symfony2 框架。
对于 livereloading 部分，我使用的是独立插件，但会监视文件并重新加载页面，但例如，由于 Lessphp 与 Twitter Bootstrap（我在前端使用的框架）不完全兼容，因此较少的编译不起作用
你有什么建议吗？我可以添加细节以防万一。
我希望尽可能多地和 Grunt 呆在一起，但如果他完成所有相同的任务或其他解决方案，我可以考虑使用 Assetics。
当我只在前端工作时，这是我实际的 Gruntfile.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'
]);