Javascript 什么是带bower和gulp的干净前端工作流?
我一直在努力弄清楚如何干净地安装和更新来自第三方供应商的客户端资产。我真正想做的就是获取当前版本并将生产就绪文件复制到固定位置。到目前为止,我能想到的最好的办法就是这件丑陋的事情:Javascript 什么是带bower和gulp的干净前端工作流?,javascript,client-side,dependency-management,bower,gulp,Javascript,Client Side,Dependency Management,Bower,Gulp,我一直在努力弄清楚如何干净地安装和更新来自第三方供应商的客户端资产。我真正想做的就是获取当前版本并将生产就绪文件复制到固定位置。到目前为止,我能想到的最好的办法就是这件丑陋的事情: gulp.task('bower', ['clean','load'], function(){ var bowerFilesToMove = [ 'angular*/*', 'bootstrap/dist/*', 'fontawesome/*',
gulp.task('bower', ['clean','load'], function(){
var bowerFilesToMove = [
'angular*/*',
'bootstrap/dist/*',
'fontawesome/*',
'jasny-bootstrap/dist/*',
'jcrop/css/*',
'jcrop/js/*',
'jquery/dist/*',
'jquery-align-column/*',
'jquery-autosize/*',
'jqueryui/ui/minified/*',
'moment/min/*',
'select2/*',
'underscore/*',
];
bowerFilesToMove.forEach(function(filespec){
gulp.src('./bower_components/'+filespec+'.css')
.pipe(flatten())
.pipe(gulp.dest('public/vendor/css'));
});
bowerFilesToMove.forEach(function(filespec){
gulp.src('./bower_components/'+filespec+'.js')
.pipe(flatten())
.pipe(gulp.dest('public/vendor/js'));
});
bowerFilesToMove.forEach(function(filespec){
gulp.src('./bower_components/'+filespec+'.map')
.pipe(flatten())
.pipe(gulp.dest('public/vendor/js'));
});
gulp.src('./bower_components/jqueryui/themes/*')
.pipe(gulp.dest('public/vendor/css/themes'));
gulp.src('./bower_components/bootstrap/dist/fonts/*')
.pipe(gulp.dest('public/vendor/fonts'));
gulp.src('./bower_components/fontawesome/fonts/*')
.pipe(gulp.dest('public/vendor/fonts'));
});
gulp.task('clean', function(){
return gulp.src('./public/vendor')
.pipe(clean({force: true}));
});
gulp.task('load', function(){
return bower();
});
我读了很多书,试图找出客户端部署的最佳实践和工具,但是我自己越来越困惑。我确信前端将比仅仅选择软件包和运行“composer update”更复杂,但这看起来相当困难。有什么更好的方法来处理它呢?每当我在生产级应用程序上工作时,我都会允许构建过程查看引用任何
标记的相关标记文件,确定需要复制哪些内容,而不是手动将特定供应商资产复制到目录中。这样可以避免复制或部署实际未使用的脚本
如果您想了解我们Yeoman团队如何使用这种类型的设置,请在此处查看我们的Gulp文件,该文件也使用了useref
任务: