@AlexRas

Как в gulp с помощью main-bower-files разложить файлы библеотек по папкам?

Здравствуйте, подскажите как можно разложить файлы библиотек по их папкам, напрмер:

Если использовать такой таск, то все файлы упадут в одну папку lib
gulp.task('bower', function() {
    gulp.src(mainBowerFiles({
            "overrides": {
                "jquery": {
                    "main": "./dist/jquery.min.js"
                },
                "bootstrap-grid": {
                    "main": [
                        './dist/bootstrap-grid.min.css'
                    ]
                }
            }
        }))
        .pipe(gulp.dest('./lib/'))
});


Как сделать так чтобы файлы упали в свои папки, тоесть:
lib
- jquery
-- jquery.min.js
- bootstrap-grid
-- bootstrap-grid.min.css
  • Вопрос задан
  • 210 просмотров
Решения вопроса 2
@AlexRas Автор вопроса
Сделал так, може у кого есть лучше варианты?

gulp.task('bower', function() {
    var mainBowerFilesArr = mainBowerFiles({
            'overrides': {
                'jquery': {
                    'main': './dist/jquery.min.js'
                },
                'bootstrap-grid': {
                    'main': './dist/bootstrap-grid.min.css'
                }
            }
        }).map( function(path) {
            return path;
        });

    for (var i = mainBowerFilesArr.length - 1; i >= 0; i--) {
        var p = mainBowerFilesArr[i].substring(mainBowerFilesArr[i].indexOf('bower_components'));
        var f = p.split('\\')[1]+'/';
        gulp.src(p).pipe(gulp.dest(path.build.lib+f));
    }
});
Ответ написан
Комментировать
zorro76
@zorro76
Зачем такое писать, потом кашу будете черпаком вылавливать?
Вот простой рабочий пример, на выходе файлы объединяются в vendor.js
// Concat vendor JS (uglify for production)
gulp.task('js:vendor', function() {
    gulp.src(mainBowerFiles({
          "overrides": {
              "jquery": {
                  "main": "./dist/jquery.min.js"
              },

              "magnific-popup": {
                  "main": "./dist/jquery.magnific-popup.min.js"
              },

             "slick-carousel": {
                  "main": "./slick/slick.min.js"
              },

              "jquery.maskedinput": {
                  "main": "./dist/jquery.maskedinput.min.js"
              },
	
	          "jqueryrotate": {
		          "main": "./jQueryRotate.js"
	          }
          }
  }))
      .pipe(jsFilter)
      .pipe(concat('vendor.js'))
      .pipe(gulpIf(env !== 'dev', uglify()))
      .pipe(gulp.dest(outputDir + 'js'))
});

во втором случае таск по вашему js коду
gulp.task('js', function() {
    gulp.src(src.js)
        .pipe(jsHint())
        .pipe(jsHint.reporter('default'))
        .pipe(concat('script.js'))
        .pipe(gulpIf(env !== 'dev', uglify()))
        .pipe(gulp.dest(outputDir + 'js'))
        .pipe(connect.reload());
});


в проект в итоге подключается два файла: main.js и vendor.js
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы