วิธีใช้งาน Angular CLI

ชีวิตดีดี๊ เมื่อเราสร้าง project ด้วย Angular CLI เราสามารถพิมพ์ไม่กี่คำสั่งเราก็สามารถที่จะ Run project ได้ แต่อย่างไรก็ตามเราก็ต้องรู้ข้อมูลพื้นฐานโครงสร้างโปรเจคนั้นด้วยน่ะจ๊ะ เดี๋ยวจะไม่เข้าใจ

ถ้าใครยังไม่ได้ติดตั้ง AngularCLI อ่านวิธีตั้งตั้งได้ที่นี่เลย

เรามาดูวิธีการใช้งาน AngularCLI กันเต๊อะ

1. พิมพ์คำสั่ง ng new ตามด้วยชื่อโปรเจคที่ต้องการ เช่น ng new MyIncome

2. เข้าไปยังโปรเจคที่เราสร้างขึ้น ด้วยคำสั่ง cd MyIncome

3. start project ด้วยคำสั่ง ng serve

4. copy url http://localhost:4200 ไปวางไว้ที่ browser จะได้ข้อมูลดังรูป

ว๊าวววเสร็จแล้ว สร้างโปรเจคด้วย AngularCLI เสร็จ และ AngularCLI ยังสามารถที่จะสร้างไฟล์ต่างได้ด้วยอีกน่ะจ๊ะ

5. เราสามารถที่จะสร้างไฟล์ต่างๆ เช่น

• component

ใช้คำสั่ง ng g component my-new-component หรือใช้แบบย่อ ng g c my-new-component

• service

ใช้คำสั่ง ng g service my-new-service หรือ ng g s my-new-service

• directive

ใช้คำสั่ง ng g directive my-new-directive หรือ ng g d my-new-directive

• Class

ใช้คำสั่ง ng g class my-new-class

• Interface

ใช้คำสั่ง ng g interface my-new-interface หรือ ng g i my-new-interface

• Enum

ใช้คำสั่ง ng g enum my-new-enum หรือ ng g e my-new-enum

ทุกๆๆไฟล์ที่มีการสร้างขึ้นมาเจ้าตัว Angular CLI จะทำการ import เข้าไปใน declarations ด้วย แบบนี้ก็สบายเลย

เขียนไว้เผื่อลืม เอาไว้เพื่อเตือนความจำตัวเอง ถ้ามีใครมาอ่านแล้วผิดพลาดตรงไหนบอกได้นะจ๊ะ เราจะได้รู้ว่าเข้าใจไม่ผิด