在Angular4 Webpack Starter中，tsconfig.webpack.json是否適用於webpack，而tsconfig.json是否適用於其他所有功能？

Question

請參考這個git倉庫： https : //github.com/AngularClass/angular-starter

Angular4 Webpack Starter附帶2個文件：

tsconfig.json

和

tsconfig.webpack.json

每個文件的TypeScript配置略有不同。

我的問題是關於這兩個文件如何與項目相關的。

tsconfig.webpack.json僅應用於tsconfig.webpack.json使用的ts-loader？ 而tsconfig.json文件將適用於其他所有內容嗎？

任何關於tsconfig.webpack.json的信息將不勝感激。

Answer 1

簡短的答案是肯定的。 已向Webpack注冊的TypeScript加載程序已顯式配置為使用tsconfig.webpack.json文件。 這可以在常見配置的第133行看到 。 tsconfig.json文件可用於IDE支持。

值得注意的是，雖然您聲明模板使用ts-loader ，但實際上使用awesome-typescript-loader 。

話雖如此，兩個加載器默認都會嘗試拾取一個名為tsconfig.json的文件，並且該模板正在鏈接行上顯式覆蓋此行為。

盡管有多個原因可能導致一個項目中要使用多個TypeScript腳本配置文件的原因，但諸如Visual Studio Code之類的編輯器卻使用了一個名為tsconfig.json功能來增強智能感知功能，設置各種選項以及確定一個項目的范圍。

兩者都使用相同的文件是絕對合理的，這實際上是默認情況下會發生的情況。

備注

請注意， AngularClass模板非常腫且復雜。 考慮到這是一個起點，毫無疑問，您將以這樣的模板為基礎，將您的應用程序作為基礎， 開始時不必要的樣板和殘料的數量會被添加到一個認真的考慮中。 如果您不熟悉所涉及的任何工具，編譯器或框架，那么它將翻倍。

順便說一下，我實際上是該存儲庫的貢獻者。 他們從我這里請求請求 ，更改了實用程序功能，有人提出了一個令人困惑的問題。 有趣的是，在我提交PR進行改進之前，我已經從項目中刪除了該功能。

在處理了一個從他們的模板之一衍生而來的項目之后，我浪費了很多時間來剔除那些與 Webpack config 相關的代碼，這些代碼不是必需的，但是會妨礙您的工作。 我們最終只獲得了數百行Webpack配置。 我不是，並且仍然不是Webpack的忠實擁護者（贏取JSPM），但是模板沒有很好地利用Webpack。 許多不必要的工作正在做，這實際上使Webpack看起來比實際要復雜。 整個助手文件基本上一文不值，與Webback，TypeScript甚至Angular無關。

由於角度課程網站出售培訓材料，因此這也令人不安。 原則上或實踐上都沒有錯，但是除了已經很復雜的工具鏈固有的功能外，它們還帶來了很多復雜性。

Answer 2

tsconfig.webpack.json是否僅應用於Webpack使用的ts-loader？

對，那是正確的。 這是 tsconfig.webpack.json中使用webpack.common.js ：

  new ngcWebpack.NgcWebpackPlugin({
    ...
    disabled: !AOT,
    tsConfig: helpers.root('tsconfig.webpack.json'),   <----------------
  }),

對於這里的 awesome-typescript-loader ：

{
  loader: 'awesome-typescript-loader',
  options: {
    configFileName: 'tsconfig.webpack.json',  <-------------------
    useCache: !isProd
  }
},

而tsconfig.json文件將適用於其他所有內容嗎？

是的，它用於tslinting或需要生成聲明文件。 如果您在IDE中工作，它也可以用於智能感知和其他特定於IDE的功能。