Construirea unei aplicații Enterprise Dynamic Pluggable extensibile cu Angular de Alexey Zuev Angular

În acest articol, vom vorbi despre modul în care putem utiliza instrumentele de construcție CLI angular pentru a crea un plugin angular precompilat AOT, care poate partaja codul comun cu alte pluginuri și chiar funcționa cu Angular universal. Aceasta este o soluție neoficială, dar funcționează bine pentru cazul nostru.

AngularInDepth se îndepărtează de Medium. Articolele mai recente sunt găzduite pe noua platformă inDepth.dev . Vă mulțumim că faceți parte din mișcarea profundă!

Iată o reprezentare simplă a ceea ce construim:

Aici avem o pagină simplă în care obținem configurarea pluginurilor dintr-un fișier plugins-config.json. Apoi încărcăm leneș pluginul AOT compilat (plugin1.js) care are o dependență de shared.js. Biblioteca partajată conține o componentă Tabs și Tabs din fabrici. Ceva mai târziu încărcăm al doilea plugin (plugin2.js) care reutilizează codul din biblioteca shared.js încărcată anterior.

Iată depozitul Github angular-plugin-architecture dacă doriți să aruncați o privire asupra codului sursă.

Folosim Angular CLI 7.3.6 în demo

Să nu așteptăm Ivy, ci să ne ocupăm de ViewEngine curent astăzi

De ce unghiular?
Scopul
Ce este un plugin?
De ce este atât de greu să creezi un plugin cu Angular?
Cerințe
Alte soluții
Către o soluție
Un singur pachet
Externe
Exporturi dinamice
Construiți un plugin
Bibliotecă unghiulară externă și partajată
Încărcați pluginul (client, server)
Cum se redă un plugin?
Cum se izolează aplicația principală de erori într-un plugin?

Echipa și comunitatea Angular continuă creșterea rapidă a ecosistemului său.

Angular ne ajută să ne structurăm codul într-un mod consecvent, astfel încât fiecare dezvoltator nou să poată fi ușor implicat într-un proiect.

Ne place faptul că urmărim cele mai bune practici web cu Angular, gândiți-vă doar la dactilografiat, observabile, redare de pe server, lucrători web, încărcare diferențială, aplicație web progresivă (PWA), încărcare leneșă etc. Toate acestea ne ajută să adoptăm aceste caracteristici într-un mod rapid.

Există, de asemenea, mai multe caracteristici pe care ni le oferă Angular, cum ar fi sistemul de injecție de dependență încorporat, formele reactive, schemele și așa mai departe.

De aceea, de obicei, alegem Angular atunci când construim o aplicație de întreprindere.

Într-o zi, clientul nostru ne-a cerut să adăugăm o nouă funcție la aplicația sa Angular Universal existentă. El dorea să aibă un sistem de management al conținutului (CMS) conectabil. Scopul a fost de a adăuga posibilitatea de a extinde funcționalitatea aplicației curente, astfel încât un dezvoltator terță parte să poată dezvolta cu ușurință un nou modul și să-l încarce. Apoi, aplicația Angular ar trebui să o ridice fără a fi necesară recompilarea întregii aplicații și redistribuire.

Pur și simplu, trebuie să dezvoltăm un sistem de pluginuri.

Sistemele de pluginuri permit extinderea unei aplicații fără modificarea codului de bază al aplicației.

Sună simplu, dar scrierea unui plugin cu Angular este întotdeauna o provocare.