หน้าแรก>การเขียนโปรแกรมที่เกี่ยวข้อง>ส่วนประกอบของบุคคลที่สาม
ดาวน์โหลด

โครงการนี้ถึงจุดสิ้นสุดของการพัฒนาแล้ว อย่าลังเลที่จะเรียกดูรหัส

ส่วนประกอบเว็บคุณภาพสูงที่มีรอยเท้าขนาดเล็ก
ขอบคุณมากที่แสดงความสนใจในโครงการนี้! หากคุณต้องการช่วยเราให้อาหาร octocat ของเราคุณควรเป็น Stargazer อย่างแน่นอน ส่วนประกอบเว็บเหล่านี้ถูกสร้างขึ้นเพื่อใช้ พวกเขามีน้ำหนักเบามี API ที่เรียบง่ายและง่ายต่อการขยายและเขียน ไปที่นี่เพื่อดูการสาธิต https://weightless.dev/elements


  • คุณภาพสูง: มีศูนย์กลางอยู่ที่แนวปฏิบัติที่ดีที่สุด
  • ทดสอบได้: กรณีทดสอบหลายร้อยกรณีทำให้แน่ใจว่าห้องสมุดมีความเสถียร
  • ใช้งานง่าย: แต่มี API ที่เรียบง่ายและเข้าใจได้
  • เข้าถึงได้: ส่วนประกอบทั้งหมดได้รับการสร้างโดยคำนึงถึงการเข้าถึง
  • การตอบสนองเดียว: แต่ละองค์ประกอบทำได้ดีมาก สิ่งนี้ทำให้ง่ายต่อการขยายและเขียน

➤สารบัญ

  • ➤การสาธิต
  • ➤การติดตั้ง
  • ➤องค์ประกอบ
  • ➤แผนงาน
  • ➤คู่มือการบริจาค
  • ➤ผู้มีส่วนร่วม
  • ➤ใบอนุญาต

➤การสาธิต

ไปที่นี่เพื่อลองสาธิต

➤การติดตั้ง 

 $ npm i weightless

หากคุณต้องการเริ่มต้นอย่างรวดเร็วคุณสามารถใช้ CLI ได้ 

 $ npm init web-config new my-project --lit

หากคุณต้องการใช้ Bundle umd คุณสามารถนำเข้า https://unpkg.com/weightless/umd/weightless.min.js โปรดทราบว่าการนำเข้าองค์ประกอบทั้งหมดนี้ขอแนะนำให้คุณใช้เพื่อการทดสอบเท่านั้น 

 < script src =" https://unpkg.com/weightless/umd/weightless.min.js " > </ script >

➤องค์ประกอบ

ชื่อ ติดแท็ก คำอธิบาย เอกสาร การสาธิต
ฉากหลัง wl-backdrop เลเยอร์มืดที่ใช้อยู่เบื้องหลังองค์ประกอบที่ซ้อนทับ เอกสาร การสาธิต
แบนเนอร์ wl-banner แสดงข้อความที่ไม่เกิดขึ้นและการกระทำที่เกี่ยวข้องที่เกี่ยวข้อง เอกสาร การสาธิต
ปุ่ม wl-button อนุญาตให้ผู้ใช้ดำเนินการและตัดสินใจเลือกด้วยการแตะครั้งเดียว เอกสาร การสาธิต
การ์ด wl-card เนื้อหาและการกระทำที่เกี่ยวข้องกับกลุ่ม เอกสาร การสาธิต
ช่องทำเครื่องหมาย wl-checkbox เปิดหรือปิดตัวเลือก เอกสาร การสาธิต
บทสนทนา wl-dialog ข้อความขัดจังหวะสูง เอกสาร การสาธิต
ผู้แบ่งแยก wl-divider เส้นบาง ๆ ที่จัดกลุ่มเนื้อหาในรายการและเลย์เอาต์ เอกสาร การสาธิต
การขยายตัว wl-expansion ให้มุมมองรายละเอียดที่ขยายได้ เอกสาร การสาธิต
ไอคอน wl-icon สัญลักษณ์สำหรับการกระทำและรายการทั่วไป เอกสาร การสาธิต
ฉลาก wl-label ทำให้องค์ประกอบของฟอร์มเข้าถึงได้มากขึ้น เอกสาร การสาธิต
รายการ wl-list-item แสดงรายการในรายการ เอกสาร การสาธิต
นาวิก wl-nav ให้การเข้าถึงจุดหมายปลายทางในแอปของคุณ เอกสาร การสาธิต
ป๊อปโอเวอร์ wl-popover องค์ประกอบที่ยึดตามบริบท เอกสาร การสาธิต
การ์ดป๊อปโอเวอร์ wl-popover-card ให้ popovers มีไหวพริบบริบท เอกสาร การสาธิต
แถบความคืบหน้า wl-progress-bar เติมบาร์จาก 0% ถึง 100% เอกสาร การสาธิต
สปินเนอร์คืบหน้า wl-progress-spinner เติมวงกลมจาก 0% ถึง 100% เอกสาร การสาธิต
วิทยุ wl-radio เลือกหนึ่งตัวเลือกจากชุด เอกสาร การสาธิต
ระลอกคลื่น wl-ripple บ่งบอกถึงการกระทำแบบสัมผัส เอกสาร การสาธิต
เลือก wl-select เลือกหนึ่งค่าขึ้นไปจากชุดของตัวเลือก เอกสาร การสาธิต
ตัวเลื่อน wl-slider ทำการเลือกจากช่วงของค่า เอกสาร การสาธิต
บาร์ wl-snackbar ให้ข้อความสั้น ๆ ที่ด้านล่างของหน้าจอ เอกสาร การสาธิต
สวิตช์ wl-switch เปิดหรือปิดตัวเลือก เอกสาร การสาธิต
แท็บ wl-tab จัดระเบียบการนำทางระหว่างกลุ่มเนื้อหา เอกสาร การสาธิต
กลุ่มแท็บ wl-tab-group จัดระเบียบการนำทางระหว่างกลุ่มเนื้อหา เอกสาร การสาธิต
ข้อความ wl-text ข้อความกลุ่มเป็นวรรค เอกสาร การสาธิต
textarea wl-textarea ฟิลด์ข้อความพหุคูณ เอกสาร การสาธิต
ฟิลด์ข้อความ wl-textfield ฟิลด์ข้อความ SingLeline เอกสาร การสาธิต
ชื่อ wl-title ระบุจุดเริ่มต้นของส่วนใหม่ เอกสาร การสาธิต
คำแนะนำเครื่องมือ wl-tooltip ข้อความที่เกี่ยวข้องกับบริบทข้อมูล เอกสาร การสาธิต

➤แผนงาน

มีสิ่งที่น่าตื่นเต้นมากมายบนแผนงาน จนถึง v1.0.0 คุณสามารถคาดหวังว่า API จะค่อนข้างเสถียร แต่การปรับโครงสร้างอาจยังคงเกิดขึ้นและทำลายความเข้ากันได้ย้อนหลัง คุณยินดีที่จะใช้ห้องสมุดสร้างคำขอดึงหรือเพิ่มปัญหา

➤คู่มือการบริจาค

คุณยินดีต้อนรับมากกว่าที่จะมีส่วนร่วมในที่เก็บนี้! ด้านล่างนี้เป็นคำแนะนำบางอย่างเกี่ยวกับวิธีการตั้งค่าโครงการเพื่อการพัฒนา

  1. โคลนที่เก็บนี้โดยใช้ git clone https://github.com/andreasbm/weightless.git
  2. เรียกใช้ npm i เพื่อติดตั้งการพึ่งพาทั้งหมด
  3. หมุนเซิร์ฟเวอร์การพัฒนาด้วย npm run s เบราว์เซอร์ควรเปิดโดยอัตโนมัติที่ URL ที่ถูกต้อง ถ้าไม่คุณสามารถเปิดเบราว์เซอร์ของคุณและไปที่ http://localhost:1350
  4. เรียกใช้การทดสอบด้วย npm run test
  5. ผ้าสำลีไฟล์ด้วย npm run lint
  6. รวบรวมเอกสารโดยเรียกใช้ npm run docs

องค์ประกอบจะถูกเขียนใน typeScript และสไตล์ชีทเขียนเป็นเขี้ยว ส่วนประกอบของเว็บทั้งหมดใช้องค์ประกอบแสง

หากคุณต้องการทราบข้อมูลเพิ่มเติมเกี่ยวกับวิธีที่คุณสามารถช่วยคุณควรตรวจสอบไฟล์ MD ที่มีส่วนร่วมอย่างแน่นอน ผู้ร่วมให้ข้อมูลทั้งหมดจะถูกเพิ่มเข้าไปในส่วนผู้มีส่วนร่วมด้านล่าง

➤ผู้มีส่วนร่วม

Andreas Mehlsen คุณ?

➤ใบอนุญาต

ได้รับใบอนุญาตภายใต้ MIT

ขยาย
ข้อมูลเพิ่มเติม
แอปที่เกี่ยวข้อง
แนะนำสำหรับคุณ
ข้อมูลที่เกี่ยวข้อง ทั้งหมด