安裝TypeScript
如果你的本地環(huán)境已經(jīng)安裝了npm
工具,可以直接通過以下命令安裝:
# 全局安裝 TypeScript
npm i -g typescript
查看TypeScript
是否安裝成功苛茂,輸入以下命令已烤,顯示版本號則安裝成功:
tsc -v
# Version 3.5.3
初始化目錄:
npm init
tsc --init
配置文件
執(zhí)行初始化命令之后,目錄下會多出一個(gè)配置文件tsconfig.json
妓羊,可以在其中進(jìn)行自定義配置:
{
"compilerOptions": {
/* Basic Options */
// "incremental": true, /* TS編譯器在第一次編譯之后會生成一個(gè)存儲編譯信息的文件胯究,第二次編譯會在第一次的基礎(chǔ)上進(jìn)行增量編譯,可以提高編譯的速度 */
"target": "es5", /* 目標(biāo)語言的版本 */
"module": "commonjs", /* 生成代碼的模板標(biāo)準(zhǔn) */
// "lib": ["ES2019.Array"], /* TS需要引用的庫躁绸,即聲明文件裕循,es5 默認(rèn)引用dom、es5净刮、scripthost,如需要使用es的高級版本特性剥哑,通常都需要配置,如es8的數(shù)組新特性需要引入"ES2019.Array" */
// "allowJs": true, /* 允許編譯器編譯JS庭瑰,JSX文件 */
// "checkJs": true, /* 允許在JS文件中報(bào)錯(cuò)星持,通常與allowJS一起使用. */
// "declaration": true, /* 開啟后會自動(dòng)生成聲明文件 */
// "declarationMap": true, /* 聲明文件存放目錄 */
// "sourceMap": true, /* 編譯成 js 文件的時(shí)候,同時(shí)生成對應(yīng)的 map 文件 */
// "outFile": "./", /* 將多個(gè)相互依賴的文件生成一個(gè)文件弹灭,可以用在AMD模塊中督暂,即開啟時(shí)應(yīng)設(shè)置"module": "AMD", */
// "outDir": "./", /* 輸出目錄*/
// "rootDir": "./", /* 指定輸出文件目錄(用于輸出),用于控制輸出目錄結(jié)構(gòu) */
// "removeComments": true, /* 刪除注釋 */
// "noEmit": true, /* 不輸出文件,即編譯后不會生成任何js文件*
/* Strict Type-Checking Options */
"strict": true, /* 嚴(yán)格模式*/
// "noImplicitAny": true, /* 不允許隱式的any類型*/
// "strictNullChecks": true, /* 不允許把null穷吮、undefined賦值給其他類型的變量 */
// "strictBindCallApply": true, /* 嚴(yán)格的bind/call/apply檢查 */
// "strictPropertyInitialization": true, /* 類的實(shí)例屬性必須初始化*/
// "noImplicitThis": true, /* 不允許this有隱式的any類型*/
// "alwaysStrict": true, /* 在代碼中注入'use strict' */
/* Additional Checks */
// "noUnusedLocals": true, /* 檢查只聲明逻翁、未使用的局部變量(只提示不報(bào)錯(cuò)) */
/* Module Resolution Options */
// "baseUrl": "./", /* 解析非相對模塊的基地址,默認(rèn)是當(dāng)前目錄 */
// "paths": {}, /* 路徑映射捡鱼,相對于baseUrl*/
// "rootDirs": [], /* 定義輸入文件根目錄 */
// "typeRoots": [], /* 定義文件的文件夾位置 */
// "types": [], /* 設(shè)置引入的定義文件 */
// "allowSyntheticDefaultImports": true, /* 允許引入沒有默認(rèn)導(dǎo)出的模塊 */
/* Source Map Options */
// "sourceRoot": "", /* 調(diào)試時(shí)源碼位置 */
// "mapRoot": "", /* 定義 source map 的存放位置 */
// "inlineSourceMap": true, /* 將 source map 一同生成到輸出文件中 */
// "inlineSources": true, /* 將 ts 源碼生成到 source map 中八回,需要同時(shí)設(shè)置 inlineSourceMap 或 sourceMap */
/* Experimental Options */
// "experimentalDecorators": true, /* 允許注解語法*/
}
}
編寫第一個(gè)TypeScript程序
在項(xiàng)目目錄下新建一個(gè)test.ts
文件,輸入以下代碼:
function say(person:string) {
console.log(person+': hello world');
}
const person1:string = "zhangsan"
say(person1)
執(zhí)行以下命令:
tsc test.ts
執(zhí)行完之后會在當(dāng)前目錄下生成一個(gè)test.js
文件,使用node
來執(zhí)行js
代碼:
node test.js
# zhangsan: hello world