Please enable JavaScript.
Coggle requires JavaScript to display documents.
TYPESCRIPT - Coggle Diagram
TYPESCRIPT
USING
Installing
Types
ForALib
npm i --save-dev
@types/<lib>
npm i uuid
import {v4 as uuidV4}
from 'uuid'
GenericFuncs
document.querySelector
<HTMLFormElement>("#id")
TypeCasing
Non-genericFunc
funcRetuningVal() as
HTMLFormElement | null
const res =
Variable
const x : SomeType
= val
FuncVariable
(letter: string) =>
var = someFunc;
FuncReturn
function (..) : boolean {..}
ArrayType
const x : SomeType[]
= [vals]
Optional
Chaining
person?.address?.street
IfExists
Call
obj.func?.()
ArrAccess
arr?.[0]
SETUP
npm i --save-dev typescript
Config-create
npx tsc --init
AutoCompile
In-package.json
start: "tsc --watch"
DestDir
OfOutput
Default
SameDir
AsFile
Custom
In-tsconfig.json
"outDir" : "./dest"
Uncomment
Problem
tsc
Uses
CommonJS
Browser
Unsupported
Using-ES6
In-tsconfig
module: "es6"
Resolved
Using
Bundlers
Webpack
Snowpack
TYPES
Creating
function(..)
task : {..}
key1: type1;
key2: type2
On-FileTop
type Task =
{k1: type1; k2: type2;...}
Using as
function(task: Task)
Optional
type Task =
{optionalKey?: type;..}
BUNDLER
CreateApp
npx create-snowpack-app
. --template
@snowpack/app-template-
blank-typescript
--force
Forcing
CurrentDir
Remove
From-public
AllFiles
Except
index.html
robots.txt
.prettierrc
Index.html
UseScript
src:dist/index.js
type:module