2015-06-28 13 views
7

Trang web tôi đang làm việc trên sử dụng đường dẫn nội dung đường ray và tệp application.scss để nhập và xử lý các tệp css khác nhau.Làm cách nào để tránh nhiều @imports của biến SASS?

Tuy nhiên, một số stylesheets được sử dụng ở những nơi cụ thể, và cho những nó làm cho cảm giác ít nhập chúng vào manifest toàn cầu. Nhưng không để import chúng đòi hỏi phải nhập khẩu variables.scss, và có thể mixins.scss vào tấm bản thân (vì vậy họ sẽ xử lý một cách chính xác), kết quả là mã trùng lặp trong css thức.

Có cách nào về cơ bản nói với bộ tiền xử lý - "tin tôi đi, biến/mixin bạn đang xem sẽ được xác định khi mọi thứ được xử lý"?

Nếu tôi không thấy ho để tránh nhập khẩu tất cả các sheet vào một biểu hiện duy nhất, mà có vẻ cồng kềnh.

Cảm ơn.

+0

Các bản sao có thể có: http://stackoverflow.com/questions/17976140/false-positive-undefined-variable-error-when-compiling-scss, http: // stackoverflow.com/questions/18408324/how-can-one-chỉ nhập-biến-và-mixins-từ-scss-stylehsheets, http://stackoverflow.com/questions/24182734/how-to-avoid-duplication-of- phong cách-trong-scss – cimmanon

+0

Tôi không hoàn toàn chắc chắn tôi nhận được điều này, nếu bạn có các tập tin mà chỉ bao gồm mixins và biến bạn sẽ có thể bao gồm chúng thường xuyên như bạn thích mà không có bất kỳ sưng lên? Không có kết quả nào trong css biên dịch –

+0

Vì vậy, sử dụng ví dụ: @import "/ mixins"; lúc bắt đầu của một kết quả tập tin css trong mã không biên dịch nhiều hơn không sử dụng nhập khẩu? Vì vậy, nó chỉ đơn giản cho phép css để có được biên dịch? Nếu vậy. tuyệt vời và cảm ơn! –

Trả lời

1

Câu trả lời ngắn cho câu hỏi của bạn là không. Các biến cần phải được định nghĩa theo thứ tự logic từ khi chúng được gọi trong biên dịch. Nó giống như một kịch bản "gà và trứng".

Từ những gì tôi có thể xác định trong mô tả của bạn, dự án bạn đang làm không biên soạn thành quy trình làm việc hợp nhất, nhưng phân thành các phần mô đun có liên quan đến cấu trúc tệp của bạn. Nếu đây là trường hợp, những gì bạn có thể làm ở đầu mỗi tập tin là tham chiếu các tập tin biến từ gốc.

Trong một công việc bình thường, bạn sẽ nhập các tập tin SCSS của bạn dựa trên hệ thống phân cấp xác định của bạn như sau:

sass/style.scss

/* Main Stylesheet */ 

@import "variables"; 
@import "mixins"; 

/* Modular Sections */ 
@import "layout/header"; 
@import "layout/body"; 
@import "layout/footer"; 

sẽ biên dịch ra một kiểu style.css với một lệnh sass sass/style.scss:style.css

Tôi giả định rằng dự án của bạn có tất cả các tệp /* Modular Sections */ được biên dịch thành các tệp CSS của riêng chúng.

bố trí/header.scss

/* Header Stylesheet */ 
@import "../variables"; 
@import "../mixins"; 

Cho một cấu trúc file tương tự:

/root 

    style.scss 
    variables.scss 
    mixins.scss 

    /layouts 

    header.scss 
    body.scss 
    footer.scss 

này tất cả dường như kinda ngớ ngẩn mặc dù. Tôi không biết tất cả các tham số đi vào trình biên dịch sass hiện tại của bạn, nhưng tôi khuyên bạn nên sử dụng một quy trình làm việc hợp nhất.

1

Bạn có thể sử dụng Partials quá trình biên dịch sẽ không cố gắng để giải thích biến vv

Về cơ bản, đổi tên tập tin mà bạn không muốn trình biên dịch để giải thích - nhưng sẽ có sẵn khi biên soạn - - với dấu gạch dưới trước tên tệp.

ví dụ: _filename.scss

Các vấn đề liên quan