Giải thích về đường dẫn nút liên quan đến nuốt chửng .pipe()

Question

Câu hỏi của tôi bắt đầu với nhau, hỏi ở đây: Gulp: How to set dest folder relative to processed file (when using wildcards)?

Tôi có một tình huống tương tự, nơi tôi cần phải thực hiện các phiên bản nén trên một cơ sở cho mỗi mô-đun. Đó là, tôi có

ui/test/one/script1.js 
ui/test/two/script2.js 

và tôi cần phải có ngụm sao chép các tập tin vào thư mục tương đối vì vậy tôi kết thúc với

ui/test/one/compressed/script1.js 
ui/test/two/compressed/script2.js 

Tôi đã sau nhiệm vụ ngụm

gulp.task('test', function() { 
    return gulp.src('ui/test/**/*.js') 
     .pipe(gulp.dest(function(file) { 
      return path.join(path.dirname(file.path), 'compressed'); 
     })); 
}); 

Tuy nhiên , khi tôi chạy nó, tôi kết thúc với

ui/test/one/compressed/one/script1.js 
ui/test/two/compressed/two/script2.js 

Tôi thấy trong số docs nơi có nội dung là

cwd - Chỉ định thư mục làm việc có liên quan đến. base - Chỉ định thư mục có liên quan đến cwd. Mặc định là nơi glob bắt đầu. Này được sử dụng để xác định tên tập tin khi lưu trong .dest()

Tôi có một số câu hỏi, đặc biệt là về .src(), .dest() và đường dẫn và tập tin đối tượng. (Tức là, mặc dù Tôi chắc rằng có nhiều cách khác để đạt được mục tiêu cuối cùng của tôi, câu hỏi này là cụ thể về hành vi của các mẫu mã ngụm ở trên và các chức năng đề cập vì vậy tôi có thể hiểu được hành vi và API của họ tốt hơn.)

Câu hỏi

• Khi các tài liệu nói "thư mục làm việc thư mục là liên quan đến", là những gì thư mục này?
• trên cùng lưu ý, liên quan đến this comment và tại chỗ trong các tài liệu mà nó nói "cơ sở -. Chỉ định thư mục tương đối so với cwd Mặc định là nơi glob bắt đầu" gì "nơi các glob bắt đầu" nghĩa là gì? Sự hiểu biết của tôi về 'glob' là nó là toàn bộ chuỗi, nhưng nó thực sự có nghĩa là một ký tự * trong chuỗi đó? Vì vậy, đối 'một số/thư mục/**/*. Js' với một tập tin hiện tại some/folder/a/b/c/foo.js Tôi không chắc chắn nếu cơ sở là some/folder/, some/folder/a/, hoặc some/folder/a/b/c/?
• là có một cách để nói <where the glob begins> + '..'?
• nơi tôi đang nói path.join (path.dirname (file.path), 'nén') Tôi giả định đó là sản xuất C:\blah\ui\test\one\compressed. Nó sau đó rằng bất cứ quyết định của tên thực tế của các tập tin có one\script1.js trong tâm trí. Làm cách nào để thay đổi quyết định của mình để chỉ suy nghĩ về script1.js?

Lưu ý: Tôi đã thử làm như sau (sử dụng ngụm-debug)

gulp.task('test', function() { 
    return gulp.src('ui/test/**/*.js', {cwd: './'}) 
     .pipe(debug({minimal: false})) 
     .pipe(rename(function(path) { 
      path.basename =  path.basename.substring(path.basename.lastIndexOf('\\') + 1); 
     })) 
     .pipe(debug({minimal: false})) 
     .pipe(gulp.dest(function(file) { 
      return path.join(path.dirname(file.path), 'compressed'); 
     })); 
}); 

Giao diện điều khiển đã cho kết quả sau cho phiên bản này của nhiệm vụ:

cwd: ./ 
base: C:\blah\ui\test 
path: C:\blah\ui\test\one\script1.js 

cwd: ./ 
base: C:\blah\ui\test 
path: C:\blah\ui\test\one\script1.js 

cwd: ./ 
base: C:\blah\ui\test 
path: C:\blah\ui\test\two\script2.js 

cwd: ./ 
base: C:\blah\ui\test 
path: C:\blah\ui\test\two\script2.js 

Vì vậy, có vẻ như việc đổi tên không có hiệu lực trên đường dẫn. Tôi cũng đã thử sửa đổi đường dẫn.dirname trong đổi tên đường ống, nhưng không thể tìm thấy bất cứ điều gì mà sẽ có tác dụng mong muốn của chỉ cần loại bỏ tên thư mục giả từ đường dẫn đầu ra cuối cùng.

Câu hỏi cuối cùng của tôi, sau đó, chính xác là những gì path.basename và path.dirname chứa cho đối tượng đường dẫn được chuyển đến hàm đổi tên?

chỉnh sửa: Tôi tìm thấy this về cách gỡ lỗi các tác vụ gulp. Làm như vậy với một tuyên bố debugger; đặt trong hàm đổi tên cho phép tôi để kiểm tra các đối tượng đường, trông như thế này:

{ 
    basename: "script1", 
    dirname: "one", 
    extname: ".js" 
} 

Thiết path.dirname để '' trong các kết quả đổi tên trong

ui/test/compressed/script1.js 
ui/test/compressed/script2.js 

nên nó có thể là đổi tên() chính nó không hữu ích cho những gì tôi cần. Nó trông giống như các tùy chọn cơ sở để .src() có thể là nơi mà chìa khóa nằm, nhưng các tài liệu là khá terse.

Answer 1

Câu hỏi 1:

gulp.src('ui/test/**/*.js') 

Dòng này là thiết lập '/ ui/test /' như thư mục gốc của bạn ('thư mục tập tin làm việc'), vì nó là cơ sở của mẫu glob của bạn. Đó là lý do tại sao 'đường dẫn tương đối' được cung cấp cho dest là 'one/script1.js' và 'two/script2.js'.

Câu hỏi 2:

By glob, các tài liệu được đề cập đến '**/* js.' Mô hình của bạn. Vì vậy, các cơ sở của glob của bạn là cùng một điều mà nó sử dụng như thư mục gốc của bạn, '/ ui/test /', mà trong trường hợp này có nghĩa là những điều tương tự như "thư mục liên quan đến cwd".

Câu hỏi 3:

Các 'cơ sở' sở hữu đối với từng con đường đang được thiết lập tương tự như các mô-đun glob2base cho mỗi tập tin đến từ các dòng gulp.src.

glob2base(new glob.Glob('/ui/test/**/*.js')) + '..'; 

cũng giống như

file.base + '..'; 

nếu điều đó có ý nghĩa đối với bạn.

Câu hỏi 4:

Tôi giả sử bạn đang sử dụng gulp-rename trong phần thứ hai của bạn mã. Vì vậy, điều này sẽ giải quyết vấn đề của bạn.

gulp.src('ui/test/**/*.js') 
    .pipe(rename(function(path){ 
     path.basename = 'compressed/' + path.basename; 
    }) 
    .pipe(gulp.dest(function(file) { 
     return file.base; 
    })); 

Các tùy chọn khác có thể được truyền cho gulp.src thể được tìm thấy here, nhưng tôi không nghĩ rằng ai trong số họ trực tiếp giải quyết những gì bạn đang cố gắng làm. gulp.src dường như không mong đợi bạn hack trong một thư mục mới ở giữa mỗi đường dẫn, vì vậy đổi tên là giải pháp đơn giản nhất.

Tôi không đổ lỗi cho bạn vì đã gặp sự cố khi tìm ra tài liệu. Tôi phải nhảy giữa ba hoặc bốn trang github khác nhau để ghép lại với nhau mọi thứ đang diễn ra. Hy vọng bạn đã học được nhiều như tôi đã làm từ này.