Làm thế nào để sử dụng máy nén django với nhiều tệp LESS nhập các tệp phổ biến?

Question

Tôi đã tổ chức các mẫu trong dự án Django của mình theo cách mà mỗi trang trên trang web bao gồm tệp LESS "chung" và mỗi trang cũng có thể chỉ định tệp LESS khác bao gồm kiểu trang cụ thể.

Vấn đề là tôi cần tệp LESS dành riêng cho từng trang để có thể tham chiếu đến các biến trong tệp LESS "chung". Cách dễ nhất để làm điều này, tôi nghĩ, chỉ đơn giản là di chuyển các khai báo biến thành một tệp riêng biệt mà cả hai tệp LESS có thể @import.

Tuy nhiên, các ứng dụng Django sử dụng các thư mục riêng để lưu trữ các tệp tĩnh của chúng. Cuối cùng, hệ thống tập tin trông giống như sau:

- common 
    - static 
     - css 
     - definitions.less 
     - common.less 
- other 
    - static 
     - css 
     - other.less

Cả common.less và other.less cần phải nhập khẩu definitions.less. Trong trường hợp của common.less này cũng đơn giản như:

@import "definitions.less"; 

Dưới đây là làm thế nào các tập tin LESS đang thực sự bao gồm trên trang, chỉ trong trường hợp đó giúp:

{% load compress %} 
{% load static %} 

{% compress css %} 
    <link href="{% static "css/common.less" %}" 
      rel="stylesheet" type="text/less"> 
{% endcompress %} 

Điều gì sẽ là cách dễ nhất để đảm bảo các định nghĩa biến phổ biến có sẵn cho cả hai tệp LESS? Tôi muốn tránh kết hợp các tệp LESS vì một vài lý do:

• Nó loại bỏ lợi ích của khớp nối lỏng lẻo (khả năng hủy kích hoạt ứng dụng mà không có bất kỳ tác dụng phụ nào).
• Dữ liệu bổ sung được truy xuất cho một trang được tăng lên vì tất cả các kiểu cho tất cả ứng dụng phải được tìm nạp.

Answer 1

Chúng tôi làm điều tương tự trong ứng dụng của mình - chúng tôi có tệp main.less chung được bao gồm bởi nhiều tệp khác ít hơn. Tuy nhiên, chúng tôi không chạy vào vấn đề này. Tôi nghĩ rằng có một vài cách xung quanh nó-- bạn có thể thay đổi vị trí của các tệp tĩnh của bạn.

Có cài đặt trong django STATICFILES_DIRS - và có vẻ như bạn có thể thay đổi vị trí của tệp tĩnh nếu muốn thay vì được lồng trong các ứng dụng như vậy. https://docs.djangoproject.com/en/dev/ref/settings/#std:setting-STATICFILES_DIRS

Mã của chúng tôi trông như thế này

{% compress css %} 
{% include "_base_css.html" %} 
{% endcompress %} 

Và sau đó _base_css.html chỉ bao gồm tất cả các tập tin ít hơn, với main.less của chúng tôi đến đầu tiên.

## _base_css.html 
<link rel="stylesheet" type="text/less" href="{{ STATIC_URL }}css/main.less"> 
<link rel="stylesheet" type="text/less" href="{{ STATIC_URL }}css/about.less"> 
<link rel="stylesheet" type="text/less" href="{{ STATIC_URL }}css/dashboard.less"> 

Nó không rõ ràng với tôi từ câu hỏi của bạn những gì lỗi là, nhưng tôi tin rằng tập tin ít phổ biến của bạn cần phải được đưa vào trước khi bất kỳ tập tin ít khác để có thể truy cập. Trong đoạn mã của bạn nó không có vẻ như bạn bao gồm điều đó. Về nén, tôi không nghĩ rằng nén tất cả các css sitewide của bạn vào một tập tin là quá xấu - đó là một tải về lần đầu tiên và sau đó là hoàn toàn lưu trữ.

Hy vọng điều này hữu ích.