วิธีสร้างส่วนประกอบในโฟลเดอร์เฉพาะด้วย angular-cli

ฉันกำลังใช้ angualr4 กับ angular-cli และฉันสามารถสร้างส่วนประกอบใหม่ด้วยคำสั่งดังต่อไปนี้

E:\HiddenWords>ng generate component plainsight

แต่ฉันต้องการที่จะสร้างองค์ประกอบของเด็กที่อยู่ในความคิด มีวิธีเกี่ยวกับ angi-cli หรือไม่?

ng g component plainsight/some-nameทำให้ไดเรกทอรีใหม่เมื่อเราใช้มัน

ผลลัพธ์สุดท้ายจะเป็น:

plainsight/some-name/some-name.component.ts

เพื่อหลีกเลี่ยงปัญหานี้ให้ใช้ประโยชน์จากตัวเลือกการแบน ng g component plainsight/some-name --flat และมันจะสร้างไฟล์โดยไม่ต้องสร้างโฟลเดอร์ใหม่

plainsight/some-name.component.ts

วิธีที่รวดเร็วง่ายและปราศจากข้อผิดพลาด

เช่นคุณต้องการสร้างส่วนประกอบในapp/componentโฟลเดอร์จากนั้นทำตามขั้นตอนเหล่านี้

1. คลิกขวาที่โฟลเดอร์ที่คุณต้องการสร้างส่วนประกอบ
2. เลือกOpen in Command Promptตัวเลือก
3. ในเทอร์มินัลใหม่ (คุณจะเห็นเส้นทางที่คุณเลือก) จากนั้นพิมพ์ ng g c my-new-component

นอกจากนี้คุณสามารถตรวจสอบกระบวนการนี้ผ่านภาพนี้

ng g c component-name

สำหรับระบุตำแหน่งที่กำหนดเอง: ng g c specific-folder/component-name

ที่นี่component-nameจะถูกสร้างขึ้นภายในโฟลเดอร์เฉพาะ

วิธี Similarl สามารถนำมาใช้สำหรับการสร้างส่วนประกอบอื่น ๆ ชอบdirective, pipe, service, class, guard, interface, enum, moduleฯลฯ

รหัสที่สั้นกว่าเพื่อสร้างองค์ประกอบ: ng g c component-name
เพื่อระบุตำแหน่ง:ng g c specific-folder/component-name

ข้อมูล
เพิ่มเติมรหัสที่สั้นกว่าเพื่อสร้างคำสั่ง: ng g d directive-name
เพื่อระบุตำแหน่ง:ng g d specific-folder/directive-name

ng g c folderName/SubFolder/.../componentName --spec=false 

ตัวเลือกด้านบนไม่ทำงานสำหรับฉันเพราะต่างจากการสร้างไดเรกทอรีหรือไฟล์ในเทอร์มินัลเมื่อ CLI สร้างส่วนประกอบมันจะเพิ่มพา ธsrc / appตามค่าเริ่มต้นไปยังพา ธ ที่คุณป้อน

ถ้าฉันสร้างส่วนประกอบจากโฟลเดอร์แอพหลักของฉันเช่นนั้น (ผิดทาง)

ng g c ./src/app/child/grandchild 

ส่วนประกอบที่สร้างขึ้นคือ:

src/app/src/app/child/grandchild.component.ts

ดังนั้นฉันต้องพิมพ์เท่านั้น

ng g c child/grandchild 

หวังว่านี่จะช่วยใครซักคน

ฉันไม่มีโชคกับคำตอบข้างต้น (รวมถึง--flat) แต่สิ่งที่ได้ผลสำหรับฉันคือ:

cd path/to/specific/directory

จากนั้นฉันก็วิ่งไป ng g c mynewcomponent

ง่าย

ng g component plainsight/some-name

มันจะสร้างโฟลเดอร์ "plainsight" และสร้างส่วนประกอบที่มีชื่ออยู่ข้างใน

ลองใช้ดู

ng g component plainsight/some-name.component.ts

หรือลองด้วยตนเองถ้าคุณรู้สึกสะดวกสบาย

เมื่อคุณอยู่ในไดเรกทอรีของโครงการของคุณ ใช้cd path/to/directoryแล้วใช้งานng g c component_name --spec=falseได้โดยอัตโนมัติทุกอย่างและปราศจากข้อผิดพลาด

g cวิธีการสร้างองค์ประกอบ

ไปที่โฟลเดอร์โครงการในพรอมต์คำสั่งหรือใน Project Terminal

เรียกใช้ cmd: ng gc componentname

Angular CLI มีคำสั่งทั้งหมดที่คุณต้องการในการพัฒนาแอพของคุณ สำหรับความต้องการเฉพาะของคุณคุณสามารถใช้ng g( ng generate) เพื่อทำงานให้สำเร็จได้อย่างง่ายดาย

ng g c directory/component-nameจะสร้างcomponent-nameส่วนประกอบในdirectoryโฟลเดอร์

ต่อไปนี้เป็นแผนที่ของคำสั่งง่ายๆที่คุณสามารถใช้ในแอปพลิเคชันของคุณ

1. ng g c comp-nameหรือng generate component comp-nameเพื่อสร้างองค์ประกอบที่มีชื่อ 'comp-name'
2. ng g s serv-nameหรือng generate service serv-nameเพื่อสร้างบริการด้วยชื่อ 'serv-name'
3. ng g m mod-nameหรือng generate module mod-nameเพื่อสร้างโมดูลที่มีชื่อ 'mod-name'
4. ng g m mod-name --routingหรือng generate module mod-name --routingเพื่อสร้างโมดูลที่มีชื่อ 'mod-name' พร้อมการจัดเส้นทางเชิงมุม

หวังว่านี่จะช่วยได้!

โชคดี!

หากคุณใช้ VSCode ให้พิจารณาใช้Angular Console

มันมีส่วนต่อประสานสำหรับ Angular CLI คุณจะเห็นตัวเลือกเพื่อระบุเส้นทาง

CLI เชิงมุมมีพลังอย่างมากและสามารถขยายได้ ในความเป็นจริงมีความสามารถมากมายที่เป็นประโยชน์สำหรับนักพัฒนาที่จะมีตัวเลือกการกำหนดค่าที่แตกต่างกันทั้งหมดสำหรับทุกคำสั่งที่มีให้

ด้วย Angular Console คุณจะได้รับคำแนะนำและสามารถดึงได้แม้กระทั่งคุณสมบัติที่ลืมได้ง่ายที่สุดหรือไม่ค่อยได้ใช้!

Angular Console เป็นครั้งแรกและสำคัญที่สุดซึ่งเป็นวิธีการทำงานที่มีประสิทธิผลมากขึ้นในการทำงานกับสิ่งที่ Angular CLI ให้

ขั้นแรกเพื่อสร้างส่วนประกอบที่คุณต้องใช้: -

• ชื่อองค์ประกอบ GC

  โดยใช้คำสั่งข้างต้นส่วนประกอบใหม่จะถูกสร้างขึ้นในโฟลเดอร์ที่มี
  (componentname) ที่คุณระบุไว้ข้างต้น

แต่ถ้าคุณต้องการสร้างส่วนประกอบภายในส่วนประกอบอื่นหรือในโฟลเดอร์เฉพาะ: -

• ชื่อส่วนประกอบ / newComponentName

ต้องการใช้ --dryRun เมื่อใช้ไดเรกทอรีที่กำหนดเอง

คุณสามารถผ่านเส้นทางไดเรกทอรีที่กำหนดเองของคุณพร้อมกับngคำสั่ง

ng g c myfolder\mycomponent

แต่มีโอกาสที่คุณจะพลาดการสะกดคำและมีการสร้างโฟลเดอร์ใหม่หรือเปลี่ยนไดเรกทอรีเป้าหมาย ด้วยเหตุนี้จึงdryRunมีประโยชน์มาก จะแสดงผลลัพธ์ว่าการเปลี่ยนแปลงจะได้รับผลกระทบอย่างไร

หลังจากตรวจสอบผลลัพธ์คุณสามารถเรียกใช้คำสั่งเดียวกันโดยไม่ต้อง-dทำการเปลี่ยนแปลง

--dryRun = true | เท็จ

เมื่อเป็นจริงให้ทำและรายงานกิจกรรมโดยไม่ต้องเขียนผลลัพธ์ออกมา

เริ่มต้น: เท็จ

ชื่อแทน: -d

เอกสารทางการ: - https://angular.io/cli/generate