Rumah  >  Artikel  >  hujung hadapan web  >  [Ringkasan] 5 petua terbaik untuk mengurus projek Angular

[Ringkasan] 5 petua terbaik untuk mengurus projek Angular

青灯夜游
青灯夜游ke hadapan
2023-01-05 20:37:132370semak imbas

Bagaimana untuk mengatur projek Angular? Artikel berikut meringkaskan 5 petua teratas untuk mengurus projek Angular Saya harap ia akan membantu anda!

[Ringkasan] 5 petua terbaik untuk mengurus projek Angular

Dengan keluaran ciri baharu, saiz Web apps semakin besar dan besar. Perubahan keluaran jenis ini berlaku setiap hari dalam proses DevOps syarikat. Dalam kitaran keluaran yang begitu pantas, kod boleh menjadi sukar digunakan dengan cepat. Terutamanya projek yang dibangunkan berdasarkan , seperti NextJS

atau

AngularJavaScript. Berikut ialah 5 amalan terbaik kami untuk mengurus projek untuk kebolehbacaan, kebolehselenggaraan dan kebolehskalaan maksimum.

Angular1. Mematuhi prinsip tanggungjawab tunggal

Banyak teras aplikasi tunggal adalah asas kod dengan kelas yang mengembang. Dengan sifatnya, program-program kembung ini sukar untuk dikekalkan. Mereka rapuh dalam erti kata bahawa menukar satu baris kod boleh memberi kesan bencana pada keseluruhan program. prinsip tanggungjawab tunggal boleh mengelakkan masalah ini.

Prinsip tanggungjawab tunggal bermaksud komponen mempunyai satu dan hanya satu fungsi. Membina aplikasi menggunakan pendekatan ini menghasilkan rangka kerja modular di mana aplikasi dirangkai bersama melalui blok kod ini.

Menggunakan kaedah ini boleh menjadikan program lebih mudah dibaca dan diselenggara. Ia juga boleh mencari fungsi tertentu dalam aplikasi dengan mudah. [Tutorial berkaitan yang disyorkan:

tutorial sudut

,

Pengajaran pengaturcaraan

]Untuk memastikan kod anda dapat memenuhi keperluan ini, anda boleh bertanya pada diri sendiri soalan: Jika jawapan anda mengandungi kata kunci , maka anda perlu memfaktorkan semula kod anda kepada kod tanggungjawab tunggal.

Membina 这代码是干什么的? aplikasi dan memanjangkannya ialah latihan yang berterusan. Dari masa ke masa, mengatur projek anda menggunakan prinsip tanggungjawab tunggal akan menjadikan aplikasi anda bersih, boleh dibaca dan boleh diselenggara. and

Angular2. Ikat kod ke

dalam

modul Ia adalah pelaksanaan daripada satu prinsip. Dalam Angular, setiap modul mewakili fungsi yang berasingan dan bebas. Beberapa jenis modul disediakan dalam untuk menentukan cara mengumpulkan atau menyusunnya secara logik. Modul Angular

TerasAngular

ialah yang digunakan untuk mewujudkan aplikasi dan memuatkan fungsi teras untuk kegunaan global.

Jadi, mana-mana perkhidmatan tunggal perlu dilaksanakan dalam modul teras. Pengepala, pengaki atau bar navigasi ialah modul jenis ini. CoreNgModuleSemua perkhidmatan (perkhidmatan singleton) yang mempunyai satu dan hanya satu contoh bagi setiap aplikasi hendaklah dilaksanakan dalam modul teras. Contohnya, perkhidmatan pengesahan atau perkhidmatan pengguna.

Ciri

Modul ciri mewakili kod yang membina fungsi aplikasi. Sebagai contoh, dalam aplikasi beli-belah dalam talian, kita akan mempunyai fungsi menambah item pada troli beli-belah dan modul berasingan untuk pembayaran.

Dikongsi

Modul kongsi terdiri daripada modul yang boleh digabungkan untuk mencipta fungsi baharu. Sebagai contoh, fungsi carian boleh digunakan untuk pelbagai fungsi dalam platform. Struktur kod anda dengan cara ini menjadikan perkara lebih mudah untuk dikesan dan meningkatkan peluang kebolehgunaan semula kod.

3. Susun fail SCSS

Fail gaya boleh menjadi tidak teratur dengan cepat jika anda tidak mengikut struktur biasa. Corak amalan terbaik umum ialah corak , yang menggunakan folder dan

fail seperti ini:

  • Apl - folder utama projek

  • Abstrak - bahagian abstrak, mengandungi semua pembolehubah, campuran dan komponen serupa

  • Teras - Mengandungi susun atur, set semula dan kod plat dandang untuk keseluruhan tapak

  • Komponen - Mengandungi gaya untuk semua komponen yang akan dibuat untuk tapak web, seperti butang, tab dan modal

  • Reka letak - Mengandungi perkara yang diperlukan untuk menentukan susun atur tapak Fail seperti pengepala dan pengaki

  • Halaman - Mengandungi setiap gaya halaman tertentu

  • Vendor - Folder pilihan ini sesuai untuk penggunaan rangka kerja bootstrap projek, mis. fail. bootstrap

  • 4. Letakkan perkhidmatan persendirian ke dalam komponen

all.scssBanyak perkhidmatan direka untuk dijalankan secara global. Kemudian, dalam beberapa kes, komponen memerlukan perkhidmatan. Amalan komponen pengekodan tradisional mengesyorkan prinsip tanggungjawab tunggal.

Dalam pendekatan ini, perkhidmatan dan komponen ditulis sebagai projek berasingan. Tetapi apa yang berlaku jika anda mempertimbangkan untuk mengalih keluar komponen perkhidmatan ini? Apa yang anda hadapi ialah kod mati, yang hanya menjadikan gudang lebih bersepah. Dalam kes ini, amalan terbaik ialah meletakkan perkhidmatan di dalam komponen.

Dengan cara ini, menyelenggara komponen dan perkhidmatan adalah lebih mudah.

5. Amalan Terbaik Sudut untuk Memudahkan Import

Struktur fail bersarang sememangnya lebih mudah daripada sistem fail rata yang meletakkan semua fail kod dalam satu navigasi direktori.

Walau bagaimanapun, apabila projek semakin hampir, struktur fail projek boleh menjadi agak rumit. Walaupun ini memudahkan pengesanan kod, ia memberikan cabaran semasa menulis pernyataan import. Apabila struktur direktori mula berkembang melebihi tiga atau empat peringkat, pernyataan

boleh menjadi sangat panjang dan sukar dibaca.

Untuk menyelesaikan masalah ini, kita boleh mengkonfigurasi alias laluan dalam fail

tsconfig.json

. Dalam fail ini, terdapat tatasusunan bernama

. Ini ialah alias laluan yang anda konfigurasikan dalam aplikasi anda. import

Apabila kod disusun, alias laluan yang ditakrifkan dalam tatasusunan ini akan digantikan dengan laluan sebenar. Nilai setiap laluan ialah objek nilai kunci yang mengandungi laluan dan alias sebenar.

Membina aplikasi dan memanjangkannya ialah latihan yang berterusan. compilerOptions

Artikel ini adalah terjemahan, dalam bentuk terjemahan percuma. Alamat asal:

Cara Mengatur Projek Sudut |. !

Atas ialah kandungan terperinci [Ringkasan] 5 petua terbaik untuk mengurus projek Angular. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Artikel ini dikembalikan pada:juejin.cn. Jika ada pelanggaran, sila hubungi admin@php.cn Padam