Trascrizione: (click per espandere)

salve a tutti in questo video parleremo
di come posso aggiungere delle
configurazioni al mio progetto in typescript allora
finora abbiamo visto che le
configurazioni possono essere scritte in
linea direttamente nel comando di
typescript come in questo caso io sto
usando la configurazione watch mode o
posso scriverle anche dentro al mio file
tsconfin.json di cui abbiamo già
cominciato a usare alcune delle
configurazioni io vi metterò dei link in
descrizione dove potete trovare più
informazioni su tutte le configurazioni
che possono essere aggiunte comunque
in questo video ne vedremo alcune allora vi mettero' un link per
questa pagina qui dove parla delle
proprietà che possono essere aggiunte al
json scritto nel tsconfig noi
stiamo già usando il compileroptions
stiamo usando anche include ma come
vedete può essere aggiunto exclude
quindi per esempio io posso aggiungere
una lista di file che voglio includere
per la compilazione da typescript a
javascript ma posso anche aggiungere
una lista di file o di folder che voglio che
non vengono compilati per esempio
io ho folder con tutti i miei test non
voglio che vengono compilati posso
aggiungerli nella lista exclude
poi c'è un'altra pagina che
parla in dettaglio di tutte le proprietà
che possono essere aggiunte al compiler
options è questa qui e ne vedremo alcune
adesso è infine c'è questa pagina qui
dove potete trovare degli esempi per
ogni proprietà del compiler option
comunque vi metterò tutto in descrizione
allora finora abbiamo visto che si può
usare outdir che e' dove voglio che
typescript salvi file compilati in
javascript
poi avete visto che io posso usare il
target e io voglio che di default
compila
il codice in ecmascript 5 però posso
scegliere che venga compilato in altri
tipi di ecmascript è il più basso che
può essere compilato ecma script 3
altrimenti posso scegliere ecmascript
6 7 8 eccetera
altre proprietà che possono
divenire utili per esempio help posso
scriverlo direttamente anche qui vi
faccio vedere un paio tsc help se
avete ts installato globalmente non serve che lo scrivete qui lo potete scrivere
direttamente sul terminal comunque tsc
può essere doppio trattino help
oppure singolo trattino h
se adesso io vado a eseguire questo
codice qui un npm run tsc h come vedete
typescript mi visualizza tutte le
proprietà che possono essere messe
dentro al mio file di
configurazione e come vedete qui sono
tantissime quindi è help e' per
aiuto poi posso anche avere un tsc init
e eseguendo questo comando io vado a
inizializzare un nuovo progetto in typescript come a mi avete visto fare
nel terzo video con npm init
potete fare tsc init è automaticamente
typescript vi inizializza un nuovo
progetto poi andiamo a vedere alcune
proprietà che possono essere messe
dentro al compiler option quindi a
questo oggetto qui abbiamo detto che si
possono vedere in queste pagine di
documentazione allora vi faccio vedere
parlerò di alcune tra le più importanti
allora per esempio c'è allowjs che
praticamente vi permette di lasciare dei
file in javascript
mescolati coi vostri file typescript
normalmente si usa questo quando
io sto migrando un progetto javascript
in typescript siccome non posso
convertire tutti i file in una volta
sola specialmente se ci sono tanti file
io posso farlo un po alla volta e posso
tenere comunque tutti i file insieme e
typescript mi permetterà di compilare file
javascript poi c'è per esempio
alwaysstrict questa qui è praticamente come ho già spiegato in un video e
in un video del tutorial di javascript
si può scrivere codice
javascript in due maniere in sloppy mode o in strict mode inizializzando questa
proprietà qui con un valore vero
automaticamente gli sto dicendo a
typescript che voglio utilizzare
javascript in maniera strict e poi
un'altra proprietà interessante inlinesourcemap per esempio è questa
inlinesourcemap e c'è anche sourcemap praticamente typescript
quando mi compila il file in
javascript automaticamente aggiunge un
commento che se inlinesourcemap sarà
una riga di commento molto molto lunga
che può essere usato da altri
moduli da altre dipendenze per
mappare il codice javascript con
l'originario che era in typescript
praticamente si poi quando sto
eseguendo il codice javascript c'è un
errore normalmente io vedo l'errore che
proviene dal file javascript però se
io ho permesso questo sourcemap
praticamente riescono a dire ok
l'errore sta arrivando da questa linea
di questo file javascript ma che
corrisponde a quest'altra linea dell
originario file type script quindi serve
per debugging praticamente per sapere da che linea del file typescript
deriva l'errore e un'altra
proprietà molto
importante è lib di questa qui vi
faccio vedere proprio un esempio
allora praticamente vi faccio vedere
io qui ho già un file vuoto che l'ho
chiamato video 8 ts
diciamo che io ho un nuovo array che
lo chiamo array 1 e è un array
multidimensionale allora dentro a questo
array quindi quando ho array
multidimensionale ciò altri array allora
per esempio ho il primo array ha un primo
elemento è un array con 2 con due numeri
e il secondo elemento è un altro array con
altri due numeri
diciamo che adesso io voglio usare il
metodo flat degli array che è un metodo
che è stato introdotto solo di recente e
quindi nella compilazione
siccome io sto compilando in ecmascript
6
per l'ecmascript 6 non esiste il metodo
flat e quindi mi dice flat
non può essere usato però io posso
dire ok io voglio che mi venga compilato
in javascript versione ecma script 6
però voglio poter usare metodi proprietà
che sono stati introdotti in altre
versioni più nuove di ecmascript
quindi io posso andare a dire ok per la
libreria e accetta un altro array e qui
vado a specificare per esempio ecma
script 2020 specificando ecma
script 2020 automaticamente
come vedete mi è scomparso l'errore io
posso andare a usare il metodo flat
anche se sto andando a fare la
compilazione in ecmascript 6 quindi io
vado a generare codice versione ecma
script 6 però tutti i metodi che
sono stati introdotti dopo l'ecma
script 6 vengono compilati insieme al
mio codice e possono essere usati nel mio codice un'altra proprietà che si che
potete usare è locale quindi se voi
mettete locale potete specificare la
lingua italiano quindi vedrete tutti i
vostri errori in italiano invece di
avere il compiler che funziona di
default in inglese
un'altra proprietà che spesso
viene usata per esempio allora se
normalmente node
importa gli altri file
usando common js ma voi potete
specificare amd o non potete usare altre
maniere per la generazione di codice
come dice qui altra proprietà che
spesso viene usata e noimplicitany
e anche per esempio nounusedparamters
vi faccio vedere un
esempio allora io per esempio qui ho
una funzione e la chiamo mia funzione
che accetta un parametro e poi questa
funzione fa solo un log di una mia
stringa ok allora io non ho errori
c'è solo un alert qui ma non ho errori
però se nel mio compileroptions vado
a dire
noimplicitany e lo metto vero
automaticamente
qui mi viene generato un errore
perché dice che il mio parametro ha
any implicito io quindi devo andare a
specificare cosa sarà questo parametro
quindi per esempio posso dire che sarà
una stringa ecco qui è come vedete
l'errore sparisce quindi mettendo quella
flag dentro al mio compiler option vado
a dire che non permetto che ci siano
parametri o variabili che hanno any
implicito l'altro che dicevo era
nounusedparamters anche questo è
vero e come vedete in questa funzione
siccome io sto dichiarando un
parametro però non lo sto usando come
vedete mi dice c'è un parametro che
è stato dichiarato ma non viene
usato e quindi posso aggiungere
severità al mio codice solo dalle
impostazioni dentro al mio compiler
option
andiamo a vedere altri flag che
possono essere usate per esempio
una l'abbiamo già vista e l'altra
outdir come ho detto prima
poi c'è outfile può essere
usato per compilare tutto il codice in
un singolo file e come valore di questa
proprietà si può mettere il nome del
file poi c'è removecomments questa qui che
praticamente vi dice che se voi avete
lasciato dei commenti nel vostro codice
typescript quando viene compilato in
javascript i commenti vengono rimossi
poi target che l'abbiamo già visto
allora target
eccolo qui dove io vado a specificare in
che versione di javascript voglio che
venga compilato il mio
codice e infine quella che abbiamo
sempre usato in tutti i video è
watch mode praticamente ecco io vi ho
fatto una veloce panoramica delle
proprietà più
usate comunque come vedete qui ce ne
sono tantissime come vi ho detto vi
metto il link in descrizione è con
questo tutto buona giornata