VUE項目中的tsconfig.json詳解

vue項目中使用TypeScript時項目中會自動生成一個tsconfig.json文件

tsconfig.json 是用於配置TypeScript 編譯時的配置選項

常用的配置如下：

{
  "compilerOptions": {
    // 目標代碼(ts -> js(es5/6/7))
    "target": "esnext",
    // 目標代碼需要使用的模塊化方案(commonjs require/module.exports/es module import/export)
    "module": "esnext",
    // 嚴格一些嚴格的檢查(any)
    "strict": true,
    // 對jsx進行怎么樣的處理
    "jsx": "preserve",
    // 輔助的導入功能
    "importHelpers": true,
    // 按照node的方式去解析模塊 import "/index.node"
    "moduleResolution": "node",
    // 跳過一些庫的類型檢測 (axios -> 類型/ lodash -> @types/lodash / 其他的第三方)
    // import { Person } from 'axios'
    "skipLibCheck": true,
    // export default/module.exports = {}
    // es module 和 commonjs
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    // 要不要生成映射文件(ts -> js)
    "sourceMap": true,
    // 文件路徑在解析時, 基本url
    "baseUrl": ".",
    // 指定具體要解析使用的類型
    "types": ["webpack-env"],
    // 路徑解析(類似於webpack alias)
    "paths": {
      "@/*": ["src/*"],
      "components/*": ["src/components/*"]
    },
    // 可以指定在項目中可以使用哪里庫的類型(Proxy/Window/Document)
    "lib": ["esnext", "dom", "dom.iterable", "scripthost"]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx"
  ],
  "exclude": ["node_modules"]
}