rootDir和outDir

現(xiàn)在你的js文件直接編譯到了根目錄下，和ts文件混在了一起。我們當(dāng)然是不喜歡這種方法的，工作中我們希望打包的js都生成在特定的一個(gè)文件夾里,比如build。

這時(shí)候你就可以通過配置outDir來配置，當(dāng)然你也可以通過rootDir來指定ts文件的位置，比如我們把所有的 ts 文件都放到 src 下。

那配置文件就應(yīng)該這樣寫：

{
    "outDir": "./build" ,
    "rootDir": "./src" ,
}

這時(shí)候你再在Terminal中輸入tsc,就會(huì)有不同的效果了。

編譯ES6到ES5語法allowjs

現(xiàn)在你在src目錄下用ES6的語法寫了一個(gè)demo.ts文件，代碼如下。

export const name = "Riven";

如果你不做任何配置，這時(shí)候試用tsc是沒有效果的。你需要到tsconfig.js文件里進(jìn)行修改，修改的地方有兩個(gè)。

"target":'es5' ,  // 這一項(xiàng)默認(rèn)是開啟的，你必須要保證它的開啟，才能轉(zhuǎn)換成功
"allowJs":true,   // 這個(gè)配置項(xiàng)的意思是聯(lián)通

這兩項(xiàng)都開啟后，在使用tsc編譯時(shí)，就會(huì)編譯js文件了。

sourceMap屬性

如果把sourceMap的注釋去掉，在打包的過程中就會(huì)給我們生成sourceMap文件.

• sourceMap 簡單說，Source map 就是一個(gè)信息文件，里面儲(chǔ)存著位置信息。
• 也就是說，轉(zhuǎn)換后的代碼的每一個(gè)位置，所對應(yīng)的轉(zhuǎn)換前的位置。
• 有了它，出錯(cuò)的時(shí)候，除錯(cuò)工具將直接顯示原始代碼，而不是轉(zhuǎn)換后的代碼。
• 這無疑給開發(fā)者帶來了很大方便。

這里我不對 Source map 文件詳細(xì)講解，如果你感興趣，可以自行百度一下吧。

noUnusedLocals和noUnusedParameters

比如現(xiàn)在我們修改demo.ts文件的代碼，改為下面的樣子。

const riven: string = null;
export const name = "riven";

這時(shí)候你會(huì)發(fā)現(xiàn)riven這個(gè)變量沒有任何地方使用，但是我們編譯的話，它依然會(huì)被編譯出來，這就是一種資源的浪費(fèi)。

//編譯后的文件
"use strict";
exports.__esModule = true;
exports.name = void 0;
var jspang = null;
exports.name = "riven";

這時(shí)候我們可以開啟noUnusedLocals：true，開啟后我們的程序會(huì)直接給我們提示不能這樣編寫代碼，有沒有使用的變量。

noUnusedParameters是針對于名優(yōu)使用的函數(shù)的，方法和noUnusedLocals：true一樣，小伙伴們自己嘗試吧。

https://www.tslang.cn/docs/handbook/compiler-options.html (編譯選項(xiàng)詳解)

總結(jié)

以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。