Tự động xóa CSS thừa thãi với PurgeCSS
CSS3
53
HTML5
31
White

Mòe viết ngày 25/10/2021

Khi sử dụng các thư viện css, ví dụ như Bootstrap, dung lượng file css thường sẽ rất lớn, nhưng trong đó sẽ có rất nhiều css không sử dụng. PurgeCSS là một công cụ để tìm và xóa những phần không sử dụng đó đi để file css của bạn nhẹ hơn rất nhiều.

Cách làm rất đơn giản. Bạn chỉ cần cung cấp cho purgecss các file css gốc, các file html và js nơi mà purgecss sẽ quét để xem những css class được sử dụng.

Với điều kiện bạn đã cài Node.js, dùng lệnh npm install để cài package purgecss.

npm i -g purgecss

Dùng lệnh purgecss với các flag

  • --css: đường dẫn đến file css gốc, flag
  • --content đường dẫn đến file html và javascript. Flag
  • --output: đường dẫn đến file css đã được lọc và loại bỏ phần thừa.
purgecss --css css/app.css --content src/index.html --output build/css/
Bình luận


White
{{ comment.user.name }}
Bỏ hay Hay
{{comment.like_count}}
Male avatar
{{ comment_error }}
Hủy
   

Hiển thị thử

Chỉnh sửa

White

Mòe

10 bài viết.
387 người follow
Kipalog
{{userFollowed ? 'Following' : 'Follow'}}
Cùng một tác giả
White
136 45
Google cách học tốt Tiếng Anh thì ra hàng đống kết quả nhưng bạn mãi không dùng được cái nào. Vậy thay vì tìm cách học tốt hãy đọc thử những cách h...
Mòe viết hơn 3 năm trước
136 45
White
44 10
(Ảnh) Dùng CSS để "sửa" nội dung HTML Ngoài nguyên nhân là muốn chơi nổi thì lí do phải dùng code CSS để tác động vào HTML là khi bạn không được...
Mòe viết 3 năm trước
44 10
White
36 16
Các khái niệm riêng của Wordpress dễ gây nhầm lẫn Ai muốn làm theme động luôn và không muốn hiểu lý thuyết có thể bỏ qua phần này. Ngay ở documen...
Mòe viết gần 3 năm trước
36 16
Bài viết liên quan
White
38 8
Lâu không post gì muốn viết một bài dài dài về js cơ mà đau đầu quá viết mãi không xong, thôi post bài ngắn vậy :smiley: Lấy screen size ở đây tôi...
Hà Phạm viết 6 năm trước
38 8
White
16 1
Lấy fake path của file trong html input Ngữ cảnh: em cần làm một cái nút tải ảnh lên có preview. GIải pháp đầu: Dùng (Link) đọc file ảnh thành ba...
Hà Phạm viết hơn 5 năm trước
16 1
{{like_count}}

kipalog

{{ comment_count }}

bình luận

{{liked ? "Đã kipalog" : "Kipalog"}}


White
{{userFollowed ? 'Following' : 'Follow'}}
10 bài viết.
387 người follow

 Đầu mục bài viết

Vẫn còn nữa! x

Kipalog vẫn còn rất nhiều bài viết hay và chủ đề thú vị chờ bạn khám phá!