ทำไมต้องใส่_
ชื่อไฟล์ไว้ใน scss?
_filename.scss
- ทำไมมันถึงต้องการ_
?
ทำไมต้องใส่_
ชื่อไฟล์ไว้ใน scss?
_filename.scss
- ทำไมมันถึงต้องการ_
?
คำตอบ:
_ (ขีดล่าง) เป็นบางส่วนสำหรับ scss นั่นหมายถึงสไตล์ชีทที่จะนำเข้า (@import) ไปยังสไตล์ชีทหลักเช่น styles.scss ข้อดีของการใช้งาน partials คือคุณสามารถใช้ไฟล์จำนวนมากเพื่อจัดระเบียบโค้ดของคุณและทุกอย่างจะถูกรวบรวมไว้ในไฟล์เดียว
import '_file';
และimport 'file';
สิ่งเดียวกันใช่มั้ย"
_
? ฉันกำลังพิจารณาลบขีดเส้นใต้ออกจากชื่อไฟล์ของฉัน ไม่ว่าไฟล์ Sass จะเป็นบางส่วน (เช่นชิ้นส่วนของโค้ดที่นำเข้าได้) ควรขึ้นอยู่กับที่ตั้งในสถาปัตยกรรมของโครงการของคุณไม่ใช่ว่าไฟล์จะมีชื่ออย่างไร
_
s หากคุณมีโครงสร้างโครงการในวิธีที่เหมาะสม
ไฟล์ sass ที่ขึ้นต้นด้วยขีดล่างเป็นบางส่วน เป็นวิธีที่ดีในการแยกสไตล์ของคุณออกเป็นส่วนตรรกะ @import
ไฟล์เหล่านี้ทั้งหมดได้รับการรวมสะสมเมื่อคุณใช้
จากคู่มือภาษา Sass:
คุณสามารถสร้างไฟล์ Sass บางส่วนที่มีตัวอย่างเล็ก ๆ ของ CSS ที่คุณสามารถรวมไว้ในไฟล์ Sass อื่น ๆ นี่เป็นวิธีที่ยอดเยี่ยมในการทำให้ CSS เป็นโมดูลและช่วยให้ง่ายต่อการบำรุงรักษา บางส่วนเป็นเพียงไฟล์ Sass ที่มีเครื่องหมายขีดเส้นใต้ คุณอาจตั้งชื่อบางอย่างเช่น _partial.scss ขีดล่างช่วยให้ Sass ทราบว่าไฟล์เป็นไฟล์บางส่วนเท่านั้นและไม่ควรสร้างเป็นไฟล์ CSS Sass partials ใช้กับ @import directive
เมื่อคุณใส่ "_" ไว้หน้าชื่อไฟล์ไฟล์นั้นจะไม่ถูกสร้างลงใน CSS เว้นแต่ว่าคุณจะนำเข้าไฟล์ดังกล่าวไปยังไฟล์ sass อื่นซึ่งไม่ใช่บางส่วน
สมมติว่าโครงสร้างโฟลเดอร์ของคุณเป็นเช่นนี้
/scss
style.scss
_list.scss
/css
ถ้าคุณเรียกใช้คำสั่ง
sass --watch scss:css
ไฟล์ style.css และ style.css.map เท่านั้นที่จะถูกสร้างขึ้นคอมไพเลอร์ sass จะละเว้น _list.scss โดยไม่แปลงเนื้อหาเป็นไฟล์ CSS
/scss
style.scss
_list.scss
/css
style.css
style.css.map
วิธีเดียวที่คุณสามารถใช้งาน partials ได้คือการนำเข้าไฟล์เหล่านั้นไปยังไฟล์. scss อีกไฟล์ด้วย
@import 'list.scss';
หากคุณลบ '_' หน้า _list.scss ผลลัพธ์ของคำสั่งจะเป็น
/scss
style.scss
list.scss
/css
style.css
style.css.map
list.css
list.css.map
วัตถุประสงค์หลักของการใช้งาน partials คือการแบ่งรหัส CSS ของเราออกเป็นหลาย ๆ ส่วนซึ่งง่ายต่อการบำรุงรักษา หวังว่านี่จะช่วยได้ ขอบคุณ
ไฟล์ที่มี _ (ขีดล่าง) จะถูกละเว้นโดยคอมไพเลอร์ อย่างไรก็ตามไฟล์เหล่านั้นจะถูกนำเข้าสู่ไฟล์ SCSS หลักเดียว (เช่น styles.scss) ซึ่งจริงๆแล้วเป็นไฟล์ที่คอมไพล์แล้ว (ไม่มีใน _ (ขีดล่าง) ในชื่อของมัน)
เป้าหมายสุดท้ายคือการรวบรวมไฟล์ SCSS เพียงไฟล์เดียวและมีไฟล์ CSS เพียงไฟล์เดียวซึ่งเป็นผลมาจากไฟล์ดังกล่าวซึ่งมีข้อดีหลายประการ
การใช้ตัวเฝ้าดูของ node-sass ในสภาวะแวดล้อมโหนดจะส่งผลให้เกิดข้อความแสดงข้อผิดพลาดหากคุณไม่มีคำนำหน้าขีดล่างดู https://github.com/sass/node-sass/issues/2762
import '_file';
และimport '_file';
ทำสิ่งเดียวกันถูกต้องหรือไม่