- vừa được xem lúc

Copy và tạo đường dẫn thư mục đơn giản với NPM Script (Phần 1)

0 0 7

Người đăng: Tran Cong Hanh

Theo Viblo Asia

Giới thiệu

Chào mọi người ! Hôm nay mình xin chia sẻ 2 module rất thuận tiện trong việc thao tác copy, tạo directory mới sử dụng NPM script

NPM-Script

1. Copy cpx
Đầu tiên là copy từ folder này sang folder kia.

$ npm i -D cpx

Ví dụ copy file từ Folder B đến Folder A chả hạn. Chỉ cần setting thế này trong package.json rồi chạy $ npm run copy

{ "scripts": { "copy": "cpx './FolderB/**/*' ./FolderA" }
}

Nếu mà chỉ muốn copy 1 loại file thôi thì setting thế này, ví dụ với file HTML chả hạn nó sẽ chỉ chọn file HTML để copy

{ "scripts": { "copy": "cpx './FolderB/**/*.html' './FolderA'" }
}

Thêm nhiều file khác thì sẽ thế này

{ "scripts": { "copy": "cpx './FolderB/**/*.{html,css,js}' './FolderA'" }
}

Ngược lại nếu ko muốn copy chỉ file nào đó thì setting như thế này
"copy": "cpx './FolderB/**/*.!(html)' './FolderA'"
Nhiều file ko copy sẽ thế này
"copy": "cpx './FolderB/**/*.!(html | CSS | JS)' './FolderA'"

2. Create New mkdirp
Tạo nhanh directory bằng module mkdirp

$ npm i -D mkdirp

Trong package.json setting như sau rồi chạy $ npm run mkdir

{ "scripts": { "mkdir": "mkdirp ./FolderA" }
}

Chúng ta cũng có thể setting tạo thư mục con như thế này nhé
"mkdir": "mkdirp ./dist/css ./dist/js ./dist/img"

Lời kết

Hi vọng với 2 module này mọi người có thể thao tác nhanh hơn thuận tiện hơn trong quá trình làm việc nhé. Cảm ơn mọi người đã đọc bài nhé.

Bình luận

Bài viết tương tự

- vừa được xem lúc

Một số quy tắc và name class phổ biến cho Front-end Dev

Trong CSS, các thủ tục setting đóng vai trò to lớn, nhưng bên cạnh đó, cách đặt tên theo các từ đơn sao cho phù hợp cũng quan trọng không kém . Đặt tên rất khó, nhưng cũng rất quan trọng .

0 0 91

- vừa được xem lúc

2021, chúng ta cần tối ưu hóa việc tải hình ảnh trên web như nào?

Rất chào các bạn,. Như các bạn đã biết, trong kỉ nguyên công nghệ, song song với sự sinh ra dày đặc của các trang web mới cũng là sự biến mất của những trang web "lạc hậu" hay hoạt động kém hiệu quả.

0 0 56

- vừa được xem lúc

Tài nguyên nghiên cứu sâu Html

1. Articles and standards. . HTML 5.

0 0 196

- vừa được xem lúc

Tìm hiểu về Event.preventDefault(), Event.stopPropagation() và Event.stopImmediatePropagation()

Chúng ta thương thấy 3 method này và có thể dẫn dến bối rối và nhầm lẫn giữa chúng:. . Event.preventDefault().

0 0 50

- vừa được xem lúc

Vanilla JS Project: Tính tuổi

1. Yêu cầu.

0 0 72

- vừa được xem lúc

Thủ thuật nhỏ để căn chỉnh image với object-fit

Chào các bạn,. Có lẽ trong hành trình code của các bạn thì không ít lần gặp vấn đề méo ảnh do fix cứng cả width, height của ảnh nhỉ? Hoặc kể cả khi bạn set value cho 1 thuộc tính weigth hoặc height còn thuộc tính còn lại để auto thì nhiều lúc ảnh cũng không được hiển thị toàn vẹn cho lắm.

0 0 48