編譯單個文件：終端?tsc 文件名

自動編譯單個文件：終端 tsc 文件名 -w

編譯整個項目：tsc 前提是得有ts的配置文件tsconfig.json

自動編譯整個項目：tsc --w?

tsconfig.json默認(rèn)文件內(nèi)容：

tsconfig.json是ts編譯器的配置文件，ts編譯器可以根據(jù)它的信息對代碼進(jìn)行編譯。

注：路徑??**表示所有目錄 *表示所有文件

• "includes":[ ] //"includes"用來指定哪些ts文件需要被編譯。

"includes":[ "./src/**/*"?]

• "excludes":[ ] //不需要被編譯的文件目錄，可選項，可有可無。

默認(rèn)值：["node_modules","bower_components","jspm_packages"]

"excludes":[ "./src/hello/**/*"?]

• "extends":[ ] //配置文件特別復(fù)雜時，引入繼承其他的json配置文件。

"extends":["./config/base.json"]

• "files":[ ]??//單個引入需要編譯的文件，通常用在文件很少的情況。

"files":[ "core.ts","sys.ts","types.ts" ]

• "compilerOptions":{ } // 編譯器的選項

compilerOptions子選項：

1. "target":" "? ?//用來指定ts被編譯為ES的版本

?"compilerOptions":{ "target":"ES3"?} // ES3(默認(rèn))、ES5、ES6/ES2015、ES2017、ES2018、ES2019、ES2020、ESNext

2. "module":" " //指定要使用的模塊化的規(guī)范

?"compilerOptions":{ "module":'es2015'?} //CommonJS、ES6、UMD、AMD、System、ES2015、ES2020、ESNext、None?

3. "lib":[ ]? //用來指定項目中需要使用的庫，一般情況下不對lib進(jìn)行修改。

?"compilerOptions":{ "lib":["dom","es6"]?}

4. "outDir':" "? //用來指定編譯后文件所在的位置。

?"compilerOptions":{ "outDir":"./dist"?}

5. "outFile':" " //用來將js代碼合并為一個文件

設(shè)置outFile以后，所有全局作用域中ts編譯出來的js代碼會合并到一個js中，一般會導(dǎo)致不靈活

?"compilerOptions":{ "outFile":"./dist/app.js"?}

7. "allowJs":false //是否對js文件進(jìn)行編譯，默認(rèn)為false

8. "checkJs":fasle //是否檢查js代碼符合語法規(guī)范，默認(rèn)為false

9. "removeComments":false //是否移除注釋，默認(rèn)為false

10. "noEmit":false //false:生成編譯后的文件，true:不生成編譯后的文件，默認(rèn)為false

11. "noEmitOnError":false //true:當(dāng)有錯誤的時候不生成編譯后的文件，默認(rèn)為false

12. "alwayScript":false //用來設(shè)置編譯以后的js文件是否使用嚴(yán)格模式，默認(rèn)為false

13. "noImplicitAny":false //是否允許出現(xiàn)隱式的any類型，默認(rèn)為false

14.?"noImplThis":false //是否允許不明確類型的this，默認(rèn)為false

15. "strictNullChecks":false //是否嚴(yán)格的檢查空值，默認(rèn)為false

16. "strict":false //所有嚴(yán)格檢查的總開關(guān)，默認(rèn)為false

總結(jié)

自動編譯文件

1. 編譯文件時，使用 -w 指令后，TS編譯器會自動監(jiān)視文件的變化，并在文件發(fā)生變化時對文件進(jìn)行重新編譯。
2. 示例：

tsc xxx.ts -w?

自動編譯整個項目

1. 如果直接使用tsc指令有序列表，則可以自動當(dāng)前項目下的所有ts文件編譯為js文件。
2. 但是能直接使用tsc命令的前提是，要先在項目根目錄下創(chuàng)建一個ts的配置文件tsconfig.json。
3. tsconfig.json是一個JSON文件，添加配置文件后，只需tsc命令即可完成對整個項目的編譯。
4. 配置選項

• include?

定義希望被編譯文件所在目錄。

默認(rèn)值：["**/*"]

示例：

"includes":["src/**/*","tests/**/*"]?

示例中，所有src目錄和tests目錄下的文件都會被編譯。

• excludes

定義需要排除在外的目錄。

默認(rèn)值：["node_modules","bower_components","jspm_packages"]

示例 ：

"exclude":["./src/hello/**/*"]

示例中，src下hello目錄下的全部文件都不會被編譯。

• extends

定義被繼承的配置文件

示例

"extends":["./config/base"]

示例中，當(dāng)前配置文件中會自動包含config目錄下base.json中的所有配置信息。

• files

指定被編譯文件的列表，只有需要編譯文件少時才會用到。

示例：

"files":[ "core.ts","sys.ts","types.ts" ]

列表中的文件都會被ts編譯器所編譯。

• compilerOptions

編譯選項是配置文件中非常重要也比較復(fù)雜的配置選項。

在compilerOptions中包含多個子選項，用來完成對編譯的配置

常用項目選項：

1. target?

設(shè)置ts代碼編譯的目標(biāo)版本

可選值： ES3(默認(rèn))、ES5、ES6/ES2015、ES2017、ES2018、ES2019、ES2020、ESNext

示例：

"compilerOptions":{ "target" : "ES6" }

編寫的代碼將會被編譯成ES6版本的js代碼。

2. lib

指定代碼運行時包含的庫（宿主環(huán)境）

可選值：ES3(默認(rèn))、ES5、ES6/ES2015、ES2017、ES2018、ES2019、ES2020、ESNext、DOM、WebWorker、ScriptHost......

示例：

"compilerOptions":{ "target" : "ES6"，"lib":["ES6"，"DOM"]，"outDir":"dist"，"outFIle":"dist/aa.js"?}

3. module

設(shè)置編譯后代碼使用的模塊化系統(tǒng)。

可選值：CommonJS、UMD、AMD、System、ES2020、ESNext、None

示例：

"compilerOptions":{ "module" : "CommonJS" }

4. outDir

編譯后的文件所在的目錄。

默認(rèn)情況下，編譯后的js文件會和ts文件位于相同的位置，設(shè)置outDir可以改變編譯后文件的位置。

?"compilerOptions":{ "outFile":"./dist/app.js"?}