Gulp n'écrase pas le fichier de destination

Question

J'ai un problème avec Gulp. J'ai décidé d'automatiser le processus de compilation de la source et des styles en un seul fichier, j'ai donc décidé d'utiliser gulp à cette fin. Cependant, il ne veut pas remplacer le fichier application.js que je crée à partir de tous les fichiers .js de mon projet. La chose étrange est qu'il écrase réellement les fichiers css compilés, qui sont générés à partir de tous les fichiers .less dans le projet. Voici comment ma structure de fichier de projet ressemble à:

. 
├── gulpfile.js 
└── apps 
    ├── base 
     ├── controllers 
      ├── controllerBaseOne.js 
      └── controllerBaseTwo.js 
     ├── directives 
      ├── directiveBaseOne.js 
      └── directiveBaseTwo.js 
     ├── services 
      └── serviceBaseOne.js 
     └── styles 
      └── styleBase.less 
     ├── header.html 
     └── index.html 
    ├── services 
     ├── compilation 
      ├── application.js 
      └── application.css 
     ├── controllers 
      ├── controllerServicesOne.js 
      ├── controllerServicesTwo.js 
      └── controllerServicesThree.js 
     ├── directives 
      ├── directiveServicesOne.js 
      ├── directiveServicesTwo.js 
      └── directiveServicesThree.js 
     ├── services 
      ├── serviceServicesOne.js 
      └── serviceServicesTwo.js 
     └── styles 
      ├── styleServicesOne.less 
      ├── styleServicesTwo.less 
      └── styleServicesThree.less 
     ├── header.html 
     └── index.html 
    ├── appMain.js 
    └── config.json 

Voici comment mon gulpfile.js regarde maintenant:

var gulp = require("gulp"); 
var gulpif = require("gulp-if"); 
var concat = require("gulp-concat"); 
var uglify = require("gulp-uglify"); 
var less = require("gulp-less"); 
var cleanCSS = require("gulp-clean-css"); 

// application components and paths: 
var compileMinify = false; 
var basePath = process.cwd() + "apps/base"; 
var webPath = process.cwd() + "apps/services"; 
var compilationPath = "compilation"; 
var appCompiledFileName = "application"; 
var stylePaths = [ 
    basePath + "/styles/**/*.less", 
    webPath + "/styles/**/*.less" 
]; 
var sourcePaths = [ 
    basePath + "/**/*.js", 
    webPath + "/**/*.js" 
]; 

gulp.task("services-source", function() { 
    return gulp.src(sourcePaths) 
     .pipe(concat(appCompiledFileName + ".js")) 
     .pipe(gulpif(compileMinify, uglify())) 
     .pipe(gulp.dest(compilationPath, { cwd: webPath })); 
}); 
gulp.task("services-styles", function() { 
    return gulp.src(stylePaths) 
     .pipe(concat(appCompiledFileName + ".less")) 
     .pipe(less()) 
     .pipe(gulpif(compileMinify, cleanCSS({ debug: true }, function(details) { 
      console.log(details.name + " original size: " + details.stats.originalSize); 
      console.log(details.name + " minified size: " + details.stats.minifiedSize); 
     }))) 
     .pipe(gulp.dest(compilationPath, { cwd: webPath })); 
}); 
gulp.task("services", [ "services-source", "services-styles" ], function() { 
    gulp.watch(sourcePaths, [ "services-source" ]); 
    gulp.watch(stylePaths, [ "services-styles" ]); 
}); 

Comme vous pouvez le voir, la tâche engouffreur services-source va dans chaque fichier .js dans le apps dossier et sous-dossiers, et concaténer tous dans un seul fichier qui doit être mis dans le dossier compilation. La même chose est faite dans la tâche services-styles, juste un peu moins de transformation est faite. Il y a aussi une vérification pour minimiser les styles et les sources, mais elle est désactivée par défaut pour le moment.

J'ai essayé d'ajouter à la fin de la tâche services-source, où vous mettez la destination du fichier respecté un paramètre pour écraser comme ceci: overwrite: true, mais rien ne semble se passer. Quand je lance le gulpfile.js, le application.js est de plus en plus gros à chaque fois - il ne l'écrase pas d'une manière ou d'une autre.

Donc, un conseil quelle peut être la cause du problème?

Answer 1

Il semble que votre fichier application.js soit inclus dans votre src lorsque vous démarrez la tâche à chaque fois.

Vous pouvez essayer d'utiliser un plug-in tel que gulp-debug pour vous déconnecter du fichier actuel dans le flux pour confirmer. (See this answer for that)

Si c'est la cause, vous pouvez alors exclure explicitement:

var sourcePaths = [ 
    "!path/to/application.js", 
    basePath + "/**/*.js", 
    webPath + "/**/*.js" 
];