2017-03-22 6 views
2

꿀꺽 거리는 것과 관련하여 문제가 있습니다. 원본과 스타일을 단일 파일로 컴파일하는 과정을 자동화하기로 결정하여 그 목적으로 꿀꺽 꿀꺽 마시는 것을 사용하기로 결정했습니다. 그러나, 내 프로젝트의 모든 파일 .js에서 작성중인 application.js 파일을 덮어 쓰지 않으려합니다. 이상한 점은 실제로 프로젝트의 모든 .less 파일에서 생성 된 컴파일 된 CSS 파일을 덮어 씁니다. 당신이 볼 수 있듯이꿀꺽 꿀꺽하게 대상 파일을 덮어 쓰지 않습니다.

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" ]); 
}); 

에서, 꿀꺽 작업 services-source는 각 .js 파일을 통해 것입니다 :

여기
. 
├── 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 

gulpfile.js 지금 모습입니다 : 여기 내 프로젝트 파일 구조가 같은 모습입니다 apps 폴더와 하위 폴더를 연결하고 모두 compilation 폴더에 넣어야하는 단일 파일로 연결하십시오. 동일한 작업이 services-styles 작업에서 수행되며 변환이 약간만 이루어집니다. 스타일과 소스를 모두 축소하는 체크가 있지만 기본적으로 비활성화되어 있습니다.

services-source 작업의 끝에 추가 된 파일의 대상을 다음과 같이 덮어 쓰기위한 매개 변수를 넣으려고했는데 아무런 문제가없는 것 같습니다 : overwrite: true. 내가 gulpfile.js을 실행할 때 매번 application.js이 더 커지고 커집니다. 어떻게 든 덮어 쓰지는 않습니다.

문제의 원인이 될 수있는 조언은 무엇입니까?

답변

1

매번 작업을 시작할 때 application.js 파일이 src에 포함 된 것처럼 들립니다.

gulp-debug과 같은 플러그인을 사용하여 확인할 스트림에서 현재 파일을 로그 아웃 해보세요. 그 원인이 있다면 (See this answer for that)

당신이 다음 명시 적으로 제외 할 수 있습니다

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

당신의 사람이, 내 생명의 은인! 나는 3 시간 동안 문제가 될 수 있다고 생각했는데, 그게 뭔지 -'compilation' 폴더도 매번 작업에 포함되었습니다 ... 그래서'sourcePaths' 배열에도 이렇게 추가되었습니다 : ' "!" + webPath + "/"+ compilationPath + "/ **/*. js"' 감사합니다. :) – yep4u

관련 문제