如何使用gulp将bower下载的angular,bootstrap等,放到scripts或styles目录下

项目中并不是用gulp来将bower组件引入的, 我不确定我是否正确理解了你的意思, 这里我说两种用法, 假设bower组件都按默认路径安装, 即bower_components：

第一种

开发

直接引用

<script src="/bower_components/angular/angular.js"></script>
<script src="/bower_components/xxx/yyy.js"></script>
<script src="/js/app.js"></script>

发布

使用gulp对引用到的脚本进行压缩

var gulp   = require('gulp'),
    watch  = require('gulp-watch'),
    concat = require('gulp-concat'),
    uglify = require('gulp-uglify');

gulp.src([
        'bower_components/angular/angular.js',
        'bower_components/xxx/yyy.js',
        'js/app.js'
    ])
    .pipe(concat())
    .pipe(uglify())
    .pipe(gulp.dest('./dist'));

推荐的做法是通过读取html文件找到所有的

第二种

开发时就引用gulp合并压缩的js文件

<script src="/dist/app.bundle.js"></script>

然后gulp写一个watch

var gulp   = require('gulp'),
    watch  = require('gulp-watch'),
    concat = require('gulp-concat'),
    uglify = require('gulp-uglify');

gulp.task('default', function (cb) {
    watch('js/app.js', function () {
        gulp.src([
            'bower_components/angular/angular.js',
            'bower_components/xxx/yyy.js',
            'js/app.js'
        ])
        .pipe(concat())
        .pipe(uglify())
        .pipe(gulp.dest('./dist'))
        .on('end', cb);
    });
});

最后, 我也用webpack, 但是目前也不能完全替代gulp, 但是webpack确实是未来的趋势, 建议学习一下, 毕竟用来解决你目前的问题就比gulp简单.