del – devfrontend.info

Problème

J’ai une tâche style:clean qui supprime des fichiers inutiles et ayant l’extension *.css dans un dossier /style. Le plugin Del fonctionne très bien pour ça, mais j’avais besoin de déclarer le scope des fichiers à cibler par la tâche en 2 entités distinctes :

Le chemin vers le dossier style/ et le format de fichier à cibler (config.paths.styles.dest + '*.css').
Une liste de fichiers à ignorer (config.clean.style.ignore).

Lors de mes tests infructueux, les fichiers ignorés étaient supprimés.

Solution

La méthode .unshift() permet l’insertion d’éléments en début de tableau.

Dans mon fichier gulpconf.json:

{
  "paths": {
    "styles": {
        "src": "src/style/",
        "dest": "style/"
    }
  },
  "clean": {
    "style": {
      "ignore": ["!style/layout.css", "!style/layout.xul.all.css", "!style/skin-variables.css", "!style/skin.css"]
    }
  }
}

{

"paths": {

"styles": {

"src": "src/style/",

"dest": "style/"

}

"clean": {

"style": {

"ignore": ["!style/layout.css", "!style/layout.xul.all.css", "!style/skin-variables.css", "!style/skin.css"]

}

Si vous n’avez pas de fichiers à ignorer, laissez le tableau vide comme ceci:

{
  "clean": {
    "style": {
      "ignore": []
    }
  }
}

{

"clean": {

"style": {

"ignore": []

}

Dans mon gulpfile.js:

gulp.task('style:clean', function(){
  var arr = config.clean.style.ignore;
  arr.unshift(config.paths.styles.dest + '*.css');
  del.sync(arr);
});

gulp.task('style:clean', function(){

var arr = config.clean.style.ignore;

arr.unshift(config.paths.styles.dest + '*.css');

del.sync(arr);

});

Optimiser ce code en passant par une fonction

ATTENTION: ce code ne fonctionne pas. En réalité, si vous avez plusieurs tâches de clean (css, js, etc…), le lancement d’une seule de ces tâches va également faire le travail de toutes les autres …

Exemple: je lance gulp js:clean et les fichiers CSS concernés par la tâche gulp css:clean sont effacés également.

function gulpClean(type, format){ var arr = eval("config.clean."+type+".ignore"); arr.unshift(eval("config.paths."+type+"s.dest + '*."+format+"'")); del.sync(arr); } gulp.task('style:clean', gulpClean('style', 'css'));

1
2
3
4
5
6
7

function gulpClean(type, format){
  var arr = eval("config.clean."+type+".ignore");
  arr.unshift(eval("config.paths."+type+"s.dest + '*."+format+"'"));
  del.sync(arr);
}

gulp.task('style:clean', gulpClean('style', 'css'));

Delete files and folders – You might want to delete some files before running your build. Since deleting files doesn’t work on the file contents, there’s no reason to use a gulp plugin. An excellent opportunity to use a vanilla node module.

var gulp = require('gulp');
    sass = require('gulp-sass');
    // rimraf = require('gulp-rimraf'); // deprecated
    del = require('del');

var paths = {
    styles  : './src/scss/**/*.scss'
};

gulp.task('clean:styles', function () {
    return del('./css');
});

gulp.task('styles', ['clean:styles'], function () {
    return gulp.src(paths.styles)
        .pipe(sass().on('error', sass.logError))
        .pipe(gulp.dest('./css'))
});

gulp.task('watch', function () {
    gulp.watch(paths.styles, ['styles']);
});

var gulp = require('gulp');

sass = require('gulp-sass');

// rimraf = require('gulp-rimraf'); // deprecated

del = require('del');

var paths = {

styles : './src/scss/**/*.scss'

};

gulp.task('clean:styles', function () {

return del('./css');

});

gulp.task('styles', ['clean:styles'], function () {

return gulp.src(paths.styles)

.pipe(sass().on('error', sass.logError))

.pipe(gulp.dest('./css'))

});

gulp.task('watch', function () {

gulp.watch(paths.styles, ['styles']);

});

Problème:

[15:29:20] ‘styles’ errored after 95 ms
[15:29:20] Error: EEXIST: file already exists, mkdir ‘/home/intlangf/tb/gulp-plugins/dist/css’
at Error (native)

gulp tasks are failing with EEXIST errors (del), Del: Delete files and folders using globs.

Une alternative consite à utiliser del.sync:

gulp.task('clean:styles', function () {
    del.sync(paths.dist + '/css');
});

gulp.task('clean:styles', function () {

del.sync(paths.dist + '/css');

});

Autres solutions à envisager

Gulp recipe – Handling the Delete Event on Watch : fonctionne bien, mais seulement au Watch.
Plugin Gulp gulp-deleted

Articles récents

Catégories

Archives

Méta

Étiquette : del

[Gulp] Supprimer un ensemble de fichiers ayant la même extension avec Del et la méthode .unshift() en omettant certains fichiers en particulier

Problème

Solution

Optimiser ce code en passant par une fonction

[Gulp] Supprimer des fichiers ou dossiers avec le module Del

Autres solutions à envisager