widget builder

เครื่องสร้างวิดเจ็ต

พัฒนาติดตั้งและแจกจ่ายวิดเจ็ต HTML สำหรับเดสก์ท็อป Windows ของคุณด้วย CLI ที่เรียบง่าย

สารบัญ

1. การติดตั้ง
2. คู่มือ QuickStart
3. ตัวอย่าง
4. การเผยแพร่และการติดตั้ง
   1. สำนักพิมพ์
   2. การติดตั้ง
5. ไฟล์กำหนดค่า
6. ใช้ CLI
7. วิดเจ็ตที่มีส่วนร่วม

การติดตั้ง

ดาวน์โหลด, unzip, นำทางไปยังโฟลเดอร์และติดตั้งด้วย npm :

 $ npm install -g
$ npm start

หรือดาวน์โหลดโดยตรงจาก npm :

 $ npm install -g widget-builder

คู่มือ QuickStart

1. สร้างโฟลเดอร์ใหม่
2. cd ไปยังโฟลเดอร์ป้อน widgets init และกรอกชื่อโครงการของคุณ
3. ยุ่งกับไฟล์ HTML ที่สร้างขึ้นเพื่อปรับแต่งลักษณะที่ปรากฏของวิดเจ็ตของคุณ
4. เพิ่มและเชื่อมโยงไฟล์ JavaScript หรือ CSS ไปยังไฟล์ HTML หลักของคุณ
5. แก้ไขไฟล์ config
6. นำทางไปยังโฟลเดอร์และป้อน widgets build เพื่อสร้างและติดตั้งวิดเจ็ตของคุณ

ตัวอย่าง

ลองดู Spotify Listener วิดเจ็ตสำหรับฟังเพลงโปรดของคุณ:

การเผยแพร่และติดตั้งวิดเจ็ต

สำนักพิมพ์

ดังนั้นคุณต้องการแบ่งปันวิดเจ็ตสำหรับการจัดจำหน่ายหรือไม่? นี่คือสิ่งที่ต้องทำ:

1. cd ไปยังโฟลเดอร์โครงการของคุณ
2. Run widgets publish
3. โฟลเดอร์ dist ใหม่จะถูกสร้างขึ้นในไดเรกทอรีเดียวกับโฟลเดอร์โครงการของคุณ ตอนนี้คุณสามารถแจกจ่ายโฟลเดอร์นี้และอื่น ๆ สามารถติดตั้งด้วย widgets install

การติดตั้ง

นี่คือวิธีการติดตั้งวิดเจ็ตที่แชร์กับคุณ:

1. นำทางไปยังโฟลเดอร์
2. widgets install

ไฟล์กำหนดค่า

ทุกโครงการวิดเจ็ตมีไฟล์ config.json ไฟล์นี้บอกโปรแกรมว่าคุณต้องการใช้การตั้งค่าใดสำหรับวิดเจ็ตของคุณ
นี่คือไฟล์กำหนดค่ามาตรฐาน:

{
  "name" : " widget " ,
  "version" : " 1.0.0 " ,
  "description" : " Custom desktop widget " ,
  "index" : " ./index.html " ,
  "properties" : {
    "x" : 100 ,
    "y" : 100 ,
    "width" : 100 ,
    "height" : 100 ,
    "transparent" : false ,
    "interact" : true ,
    "draggable" : true
  }
}

คุณสมบัติ	คำนิยาม
name (สตริง)	ชื่อโครงการ
version (สตริง)	เวอร์ชันโครงการ
index (สตริง)	การอ้างอิงถึงไฟล์ HTML หลักของคุณ การอ้างอิงอื่น ๆ (เช่น JS หรือ CSS) ควรเชื่อมโยงในไฟล์นี้
x , y , width และ height (จำนวนเต็ม)	ตำแหน่งและขนาดของวิดเจ็ตของคุณเมื่อเริ่มต้นขึ้นครั้งแรก
transparent (บูลีน)	ทำให้พื้นหลังของวิดเจ็ตโปร่งใส
interact (บูลีน)	ทำให้วิดเจ็ตโต้ตอบได้
draggable (บูลีน)	ทำให้วิดเจ็ตมีความสามารถในการแบ่งแยกได้
top (บูลีน)	ทำให้วิดเจ็ตอยู่ด้านบนของหน้าต่างทั้งหมด
requirements (อาร์เรย์)	แพ็คเกจ NPM ที่จำเป็นสำหรับวิดเจ็ตในการใช้งาน แพ็คเกจเหล่านี้ติดตั้งในเครื่องเมื่อติดตั้งวิดเจ็ต
install (สตริงหรืออาร์เรย์)	สคริปต์เพื่อเรียกใช้ระหว่างการติดตั้งวิดเจ็ต

ใช้ CLI

เมื่อติดตั้งเครื่องสร้างวิดเจ็ตแล้ว CLI สามารถเข้าถึงได้ด้วย widgets คำหลัก

คำสั่ง

สั่งการ	คำนิยาม
widgets build [folder]	สร้างไฟล์ HTML ไปยังวิดเจ็ตเดสก์ท็อปและติดตั้ง
widgets publish [folder]	สร้างไฟล์ dist ที่สามารถติดตั้งโดยวิดเจ็ต CLI
widgets install [folder]	ติดตั้งวิดเจ็ตที่โฟลเดอร์
widgets init [folder]	เริ่มต้นโครงการวิดเจ็ต
widgets list	แสดงรายการวิดเจ็ตที่ติดตั้งทั้งหมด
widgets uninstall <widget>	ถอนการติดตั้งวิดเจ็ตตามชื่อ
widgets config <widget>	กำหนดค่าวิดเจ็ตตามชื่อ
widgets start [folder]	เริ่มวิดเจ็ตที่โฟลเดอร์

ตัวเลือก

สั่งการ	คำนิยาม
widgets --help	แสดงความช่วยเหลือ
widgets --version	แสดงเวอร์ชันปัจจุบัน

วิดเจ็ตที่มีส่วนร่วม

ที่นี่คุณสามารถค้นหาคำแนะนำสำหรับการแบ่งปันวิดเจ็ตที่คุณสร้างขึ้น