बूटस्ट्रैप 4 कस्टम चर पर हावी नहीं होता

मैं इस तरह एक मुख्य styles.scss है:बूटस्ट्रैप 4 कस्टम चर पर हावी नहीं होता

$green: #71c835 !important;

//@import "../components/bootstrap/scss/bootstrap"; 

// Core variables and mixins 
@import "../components/bootstrap/scss/functions"; 
@import "../components/bootstrap/scss/mixins"; 
@import "components/variables"; 
@import "../components/bootstrap/scss/variables";

मैं इस तरह मेरी components/variables में सफलता चर ओवरराइड करने के लिए कोशिश लेकिन यह बूटस्ट्रैप variables.scss का रंग उठाता रहता है जो $green: #28a745 !default;

स्पष्ट बनाने के लिए

// Core variables and mixins 
@import "../components/bootstrap/scss/functions"; 
@import "../components/bootstrap/scss/mixins"; 
@import "../components/bootstrap/scss/variables"; 
@import "components/variables";

यह वास्तव में मुझे पागल ड्राइव कैसे मैं बस बूटस्ट्रैप चर

स्रोत

2017-10-12 Sreinieren

क्या आपने एससीएसएस के लोडिंग अनुक्रम को बदलने की कोशिश की है? आप आखिरी बार ओवरराइड वैरिएबल वाली फ़ाइल लोड कर सकते हैं। –

आपका मतलब क्या है? – Sreinieren

आप "घटक/बूटस्ट्रैप/एसएसएस/चर" से पहले "घटक/चर" आयात कर रहे हैं, इसलिए मैं सुझाव दे रहा हूं कि आप इन दो फ़ाइलों को आयात करने के अनुक्रम को बदल सकते हैं ताकि आपके चर के साथ फ़ाइल को अंतिम रूप में आयात किया जा सके। । –

$green: #71c835 !important; मतलब है को हरी चर का मान सेट ओवरराइड कर सकते हैं: देखने मैं allready इस तरह इन दोनों फ़ाइलों के अनुक्रम स्विच करने की कोशिश की यह हेक्स कोड महत्वपूर्ण के बाद।

इसका मतलब यह नहीं है कि इस हेक्स कोड में हरे रंग के चर का मान सेट करें और उस मान को बदलने के बाद के प्रयासों को अनदेखा करें।

आप बदले जाने से एक चर नहीं रोका जा सकता।

आपको अपना कोड सही क्रम में लिखना है।

आप ओवरराइड करने के लिए ../components/bootstrap/scss/variablescomponents/variables से तो components/variablesआयात एक दूसरे के बाद चाहते हैं।

स्रोत

2017-10-12 13:02:30 Quentin

पहले से ही कोशिश की लेकिन मुझे एक ही परिणाम देता है। – Sreinieren

क्या आपके पास इसे हल करने का कोई अन्य विचार हो सकता है? – Sreinieren

पहले मामले का प्रयोग करें और चर आप ओवरराइड और मूल्य में परिवर्तन करना चाहते पेस्ट को दूर !default

..... 
@import "components/variables"; 
@import "../components/bootstrap/scss/variables";

प्रति। और !default विशेषता को हटा दें। इसे फिर से संकलित करें।

!default विशेषता रिवर्स की तरह काम करती है! महत्वपूर्ण। तो यह पहले घोषित चर के मूल्य लेता है। तो !default

!important; // हमेशा जीतता है।

!default; // यदि var पहले ही असाइन किया गया है तो उसे ले लें। - Reference

तो अब components/variables

$green: #71c835;

और ../components/bootstrap/scss/variables

$green: #28a745;

स्रोत

2017-10-27 05:20:22 Znaneswar

शायद तुम override.scss बना सकते हैं और हेम डाल के बाद आप

@import "../components/bootstrap/scss/variables.scss"; 
@import "custome/scss/override.scss";

variables.scss रहे

कोड ओवरराइड।एसएसएस:

$green: #you_code;

स्रोत

2017-10-27 14:10:11

बूटस्ट्रैप 4 कस्टम चर पर हावी नहीं होता

उत्तर

संबंधित मुद्दे