Angular 11-serie (XIV) produktionsmiljø til fejlfinding

Lille skarn · Opslået på 11/08/2020 17.59.35

Angular 9 serie (1) dynamisk belastede komponenter
https://www.itsvse.com/thread-9238-1-1.html

Parametre for vinkel 9-serie (2) dynamiske komponenttransmissionsparametre
https://www.itsvse.com/thread-9245-1-1.html

Angular 9-serie (3) abonnerer på dynamiske komponentbegivenheder
https://www.itsvse.com/thread-9246-1-1.html

Angular 9 Series (IV) specialrørledninger
https://www.itsvse.com/thread-9248-1-1.html

Angular 9 Series (V) formaterer beløbsvalutaformatet
https://www.itsvse.com/thread-9249-1-1.html

Angular 9-serie (VI) kalder native JS-variabler og -metoder
https://www.itsvse.com/thread-9254-1-1.html

Angular 9-serie (VII) CSS-lignende sigtemod
https://www.itsvse.com/thread-9264-1-1.html

Angular 9-serie (VIII) opdaterer værdien af en underkomponent ved at udløse en hændelse via et sæt
https://www.itsvse.com/thread-9267-1-1.html

Angular 9 Series (ni) #id vælger anvendt på siden
https://www.itsvse.com/thread-9278-1-1.html

Angular 9-serien (10) indlejrer vconsole og eruda udvikler debugging-paneler
https://www.itsvse.com/thread-9286-1-1.html

Angular 9 Serie (XI) 5 måder at definere stilarter på
https://www.itsvse.com/thread-9305-1-1.html

Angular 9-serien (XII) genererer dynamiske tokens baseret på OTP'er
https://www.itsvse.com/thread-9325-1-1.html

Angular 10-serien (tretten) introducerer Baidu echarts-diagrammer
https://www.itsvse.com/thread-9347-1-1.html

Vi pakker Angular-projektet ind i et produktionsmiljø med build-kommandoen, og den forventede effekt kan afvige fra det, vi ser i vores udviklingsmiljø.

TS-kode:

Login er synlig.

AppComponent er den nuværende komponent.

Renderingerne af udviklingsmiljøet og produktionsmiljøet er som følger:

Produktionsmiljøet var slet ikke, som vi havde forventet.

Om build-kommandodataene:

Optimering af vinkelbyggets ydeevne
https://www.itsvse.com/thread-9203-1-1.html

På nuværende tidspunkt skal vi fejlfinde det.
SourceMap er en informationsfil, der gemmer lokationskortlægningen af kildekoden og den kompilerede kode

I front-end arbejde bruges det primært til at løse fejlfindingsproblemer inden for følgende tre aspekter:

a. Efter kodekomprimering er forvirret
b. Efter kompilering til CSS eller JS ved hjælp af andre sprog som sass og typeScript
c. Efter multi-fil-sammenfletning ved hjælp af pakkeværktøjer som webpack

I de tre ovenstående tilfælde kan vi ikke fejlfinde kildekoden lige så let som ved fejlfinding, så vi har brug for SourceMap til at hjælpe os med at konvertere den til kildekode i konsollen for at fejlfinde.

Vi skal ændre build-kommandoen, som er som følger:

Login er synlig.

(Før tilføjelse af parametre)

(Efter tilføjelse af parametre)

Du kan se, at mange *.map-filer genereres.

Som vist på billedet ovenfor, brug Google Chrome, tryk F12 for at gå ind i udviklertilstand, vælg kilde, vælg main.js, og højreklik derefter og vælg "Tilføj kildekort"-muligheden for at tilføje den genererede mappefiladresse.

For eksempel:

http://127.0.0.1:8089/main.568ae4bdd06023f965c7.js.map

(Slut)

[Kantet] Angular 11-serie (XIV) produktionsmiljø til fejlfinding

Relaterede indlæg

Afsnit set