Sencha Touch - สร้าง
ความต้องการเว็บแอปพลิเคชันในปัจจุบันคือการพัฒนาแอปพลิเคชันที่รวดเร็วโดยใช้ความพยายามในการพัฒนาน้อยลง Sencha Touch ช่วยในการดำเนินการดังกล่าวได้อย่างง่ายดายเนื่องจากมีไลบรารีบิวด์จำนวนมากให้เลือกตามการพัฒนาหรือโค้ดการผลิตพร้อมกับสิ่งอำนวยความสะดวกในการสร้างบิลด์ที่กำหนดเอง
ไลบรารีการสร้าง Sencha Touch โหลดคลาสแบบไดนามิก การโหลดแบบไดนามิกหมายถึงคลาสที่โหลดเมื่อจำเป็นและจะรวมเฉพาะคลาสเหล่านั้นซึ่งจำเป็นในแอปพลิเคชัน สิ่งนี้ทำให้แอปพลิเคชันทำงานได้เร็วขึ้นเนื่องจากจำนวนไฟล์ที่ต้องโหลดลดลงและลดเวลาในการโหลดไปพร้อม ๆ กัน
Sencha Touch 2.x มีไลบรารีบิวด์ห้าไลบรารีต่อไปนี้
| ซีเนียร์ | การสร้างและการใช้งาน |
|---|---|
| 1 | sencha-touchdebug.js โครงสร้างนี้ใช้ในขณะที่พัฒนาแอปพลิเคชันภายในเครื่อง เป็นเวอร์ชันที่ไม่มีการปิดกั้นพร้อมความคิดเห็นและบันทึกการดีบักทั้งหมดเพื่อให้ง่ายต่อการดีบักขณะพัฒนา |
| 2 | senchatouch.js ไฟล์นี้ใช้เพื่อการผลิต เป็นเวอร์ชันที่ลดขนาดเมื่อเรามีบิลด์ที่กำหนดเอง |
| 3 | sencha-touchall.js ไฟล์นี้ใช้เพื่อการผลิต เป็นเวอร์ชันย่อส่วนเมื่อเราไม่มีบิลด์ที่กำหนดเอง |
| 4 | sencha-touchall-debug.js ไฟล์นี้ใช้สำหรับการดีบักในการผลิต ไม่มีการย่อขนาดและมีความคิดเห็นและบันทึกการแก้ไขข้อบกพร่องทั้งหมด |
| 5 | sencha-touchall-compat.js โครงสร้างนี้ใช้เพื่อย้ายเวอร์ชัน 1.x ไปเป็นเวอร์ชัน 2.x จะแจ้งเตือนทุกที่ที่รหัสเวอร์ชัน 1.x เข้ากันไม่ได้และจำเป็นต้องแก้ไขโค้ด |
ด้วยโครงสร้างที่กล่าวมาข้างต้น Sencha Touch มีสิ่งอำนวยความสะดวกในการสร้างงานสร้างแบบกำหนดเอง
ข้อดีของการสร้าง Custom Build
การสร้างแบบกำหนดเองไม่ได้โหลดไฟล์สัมผัสทั้งหมด มันโหลดเฉพาะไฟล์ที่เราใช้ในแอปพลิเคชันซึ่งทำให้แอปพลิเคชันเร็วขึ้นและดูแลรักษาได้ง่าย
Sencha CMD ใช้เพื่อสร้างงานสร้างแบบกำหนดเอง ในการสร้างบิลด์แบบกำหนดเองใน Sencha CMD ให้ไปที่ไดเร็กทอรีที่มีไฟล์แอพอยู่และพิมพ์คำสั่งต่อไปนี้เพื่อสร้างบิลด์
| ซีเนียร์ | คำสั่งและการใช้งาน |
|---|---|
| 1 | sencha app build native สร้างแอปและเตรียมไฟล์ชื่อ packager.temp.json ที่คุณสามารถใช้เพื่อทำแพ็กเกจแอปพลิเคชันได้โดย packager.temp.json เหมือนกับ packager.json แต่มีเส้นทางเพิ่มเติม |
| 2 | sencha app build -run native สร้างและจัดแพ็กเกจแอปพลิเคชันโดยอัตโนมัติและเปิดตัวจำลองที่เหมาะสม |
| 3 | sencha app build package สร้างแอปด้วยการรองรับแพ็กเกจ แต่ไม่ได้กำหนดค่าไฟล์ JSON ของแพ็กเกจ สิ่งนี้มีประโยชน์สำหรับโปรเจ็กต์ที่ดูแลไฟล์ packager.json หลายไฟล์ด้วยตนเอง |
เมื่อสร้างสำเร็จมันจะสร้างไฟล์ all-class.js ซึ่งเราจำเป็นต้องรวมไว้ใน index.html ของเราเพื่อให้พร้อมใช้งานจริง
รหัสต่อไปนี้แสดงการเปลี่ยนแปลงที่ต้องทำสำหรับรหัสที่พร้อมใช้งานจริง
Index.html before building application
<!DOCTYPE html>
<html>
<head>
<link href = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css" rel = "stylesheet" />
<script type = "text/javascript" src = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/sencha-touch-debug.js"></script>
<script type = "text/javascript" src = "app.js"> </script>
</head>
<body>
</body>
</html>Index.html after building the application
<!DOCTYPE html>
<html>
<head>
<link href = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css" rel = "stylesheet" />
<script type = "text/javascript" src = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/sencha-touch.js"></script>
<script type = "text/javascript" src = "app.js"> </script>
<script type = "text/javascript" src = "app-classes.js"> </script>
</head>
<body>
</body>
</html>