Câu trả lời:
Từ làm việc với các bộ tiền xử lý CSS trong DevTools của Chrome :
Nhiều nhà phát triển tạo các biểu định kiểu CSS bằng cách sử dụng bộ tiền xử lý CSS, chẳng hạn như Sass, Less hoặc Stylus. Bởi vì các tệp CSS được tạo, việc chỉnh sửa trực tiếp các tệp CSS không hữu ích.
Đối với các bộ tiền xử lý hỗ trợ bản đồ nguồn CSS, DevTools cho phép bạn chỉnh sửa trực tiếp các tệp nguồn tiền xử lý trong bảng Nguồn và xem kết quả mà không phải rời DevTools hoặc làm mới trang. Khi bạn kiểm tra một phần tử có kiểu được cung cấp bởi tệp CSS được tạo, bảng Thành phần sẽ hiển thị một liên kết đến tệp nguồn gốc, chứ không phải tệp .css được tạo.
Nếu bạn chỉ muốn thoát khỏi lỗi, bạn cũng có thể xóa dòng này trong bootstrap.css
:
/*# sourceMappingURL=bootstrap.css.map */
#
và nó sẽ biến thành một nhận xét đơn giản, trong trường hợp bạn muốn nó trở lại sau.
bootstrap.css
, nó có gây ra bất kỳ lỗi hoặc loại điều gì không?
gulp --production
nếu bạn sử dụng gulp, điều này sẽ không bao gồm dòng sourceMapping đó) và loại trừ các tệp * .map khỏi tải lên của bạn đến máy chủ sản xuất.
Css bootstrap có thể được tạo bởi Ít. Mục đích chính của tệp bản đồ được sử dụng để liên kết mã nguồn css với mã nguồn ít hơn trong công cụ chrome dev. Như chúng ta đã từng làm. Nếu chúng ta kiểm tra phần tử trong công cụ chrome dev. bạn có thể xem mã nguồn của css. Nhưng nếu bao gồm tệp bản đồ trong trang với tệp css bootstrap. bạn có thể thấy ít mã hơn áp dụng cho kiểu phần tử bạn muốn kiểm tra.
Bạn đã bao giờ thấy mình muốn bạn có thể giữ mã phía máy khách của bạn có thể đọc được và quan trọng hơn là có thể gỡ lỗi ngay cả sau khi bạn kết hợp và rút gọn nó, mà không ảnh hưởng đến hiệu suất? Bây giờ bạn có thể thông qua sự kỳ diệu của bản đồ nguồn.
Bài viết này giải thích Bản đồ nguồn bằng cách sử dụng một cách tiếp cận thực tế.
Đối với bất kỳ ai đến đây để tìm kiếm các tệp này (Giống như tôi), bạn thường có thể tìm thấy chúng bằng cách thêm .map
vào cuối URL:
https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css.map
Đảm bảo thay thế phiên bản bằng bất kỳ phiên bản Bootstrap nào bạn đang sử dụng.
Tệp bản đồ CSS là gì?
Đó là một tệp định dạng JSON liên kết tệp CSS với các tệp nguồn của nó, thông thường, các tệp được viết bằng các bộ tiền xử lý (ví dụ: Ít hơn, Sass, Bút stylus, v.v.), đây là để gỡ lỗi trực tiếp cho các tệp nguồn từ web trình duyệt.
CSS tiền xử lý là gì? Ví dụ: Sass, Ít hơn, Bút stylus
Nó là một công cụ tạo CSS sử dụng sức mạnh lập trình để tạo CSS mạnh mẽ và nhanh chóng.
\n
?