Подтвердить что ты не робот

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

Я пытаюсь создать простую задачу gulp, которая извлекает все зависимости bower.json и вставляет их в файл index.html.

Вот как выглядит мой gulpfile.js:

var gulp = require('gulp');
var bowerFiles = require('main-bower-files');
var inject = require('gulp-inject');

gulp.task('default', function() {
    gulp.src('./public/index.html')
        .pipe(inject(gulp.src(bowerFiles({
            paths: {
                bowerDirectory: './public/bower_components',
                bowerJson: './public/bower.json'
            }
        }), {read: false}), {name: 'bower'}))
        .pipe(gulp.dest('./build'));
});

И он работает. Вот как выглядит мой index.html в каталоге. /build:

<!-- bower:js -->
    <script src="/public/bower_components/zepto/zepto.js"></script>
<!-- endinject -->

Однако я не могу сделать файлы main-bower, чтобы захватить мои измененные зависимости (в этом примере включить '/public/bower_components/zepto/zepto.min.js').

Я пробовал эти опции переопределения:

{
    "overrides": {
        "BOWER-PACKAGE": {
            "main": "**/*.min.js"
        }
    }
}

и это:

{
    "overrides": {
        "BOWER-PACKAGE": {
            "main": {
                "development": "*.js",
                "production": "*.min.js",
            }
        }
    }
}

и это не сработало: (

Что я делаю неправильно?

Спасибо заранее!

4b9b3361

Ответ 1

Вам нужно указать имя пакета, который вы хотите переопределить, BOWER-PACKAGE здесь заменяет текст. Вы не хотите переопределять все ваши зависимости и почему он переопределяет зависимость.

Итак, измените ваш bower.json как:

{
  "overrides": {
    "zepto": {
      "main": "zepto.min.js"
    }
  }
}

Ответ 2

Существует два решения.
Во-первых, вы можете использовать bower-main, чтобы отличить мини файлы от неминифицированных файлов.

Другим вариантом является непосредственная работа над списком, возвращаемым файлами main-bower файлов, и проверка наличия мини файлов. Этот фрагмент заменяет пути файлов по их эквиваленту, если они существуют.

var mainBowerFiles = require('main-bower-files');
var exists = require('path-exists').sync;

var bowerWithMin = mainBowerFiles().map( function(path, index, arr) {
  var newPath = path.replace(/.([^.]+)$/g, '.min.$1');
  return exists( newPath ) ? newPath : path;
});

См. этот смысл для полной задачи Gulp.