美文网首页
tsconfig.json应用

tsconfig.json应用

作者: 废弃的种子 | 来源:发表于2023-08-31 11:37 被阅读0次

tsconfig.json是TypeScript编译器的配置文件,用于指定编译TypeScript代码时的编译选项和编译目标等信息。通过修改该文件,可以定制TypeScript编译器的行为,例如指定编译目标、启用或禁用特定的语言特性、设置代码检查规则等。

以下是一些常用的tsconfig.json选项(12个):

  • compilerOptions:编译器选项,用于配置TypeScript编译器的行为,包括指定目标JS版本、模块化方式、输出目录、是否生成source map等。
  • files:指定需要编译的文件列表,可以是相对或绝对路径。
  • include:包含需要编译的文件的glob路径模式。
  • exclude:排除不需要编译的文件的glob路径模式。
  • extends:用于扩展其他tsconfig.json配置,可以被配置文件继承。
  • compileOnSave:是否在保存文件时自动编译。
  • references:使用项目引用,可以将一个项目作为另一个项目的依赖。
  • typeAcquisition:自动获取类型声明的设置。
  • angularCompilerOptions:帮助编译Angular应用程序的特殊编译器选项。
  • excludeDirectories:确定不应该被搜索的顶级目录。
  • excludeFiles:指定应该被忽略的文件。
  • includeDirectories:包含需要编译的文件的目录列表。
    通过在项目根目录下创建tsconfig.json文件,并配置以上选项,可以定制TypeScript编译器的行为,以满足项目的需求。

compilerOptions

{
  "compilerOptions": {
    /* Visit https://aka.ms/tsconfig to read more about this file */

    /* Projects */
    // "incremental": true,                              /* 保存.tsbuildinfo文件以允许增量编译项目。*/
    // "composite": true,                                /* 启用允许TypeScript项目与项目引用一起使用的约束。*/
    // "tsBuildInfoFile": "./.tsbuildinfo",              /* 指定.tsbuildinfo增量编译文件的路径。 */
    // "disableSourceOfProjectReferenceRedirect": true,  /* 在引用复合项目时,禁用首选源文件而不是声明文件。 */
    // "disableSolutionSearching": true,                 /* 编辑时将项目从多项目参照检查中选择出来。 */
    // "disableReferencedProjectLoad": true,             /* 减少TypeScript自动加载的项目数量。 */

    /* Language and Environment */
    "target": "es2016",                                  /*  指定编译后的 JavaScript 代码的目标版本。可选值包括 "es3"、"es5"、"es6"、"es2015"、"es2016"、"es2017"、"es2018"、"es2019"、"es2020"、"es2021"、"esnext"。默认值为 "es3"。 */
    // "lib": [],                                        /* 指定一组描述目标运行时环境的绑定库声明文件。*/
    // "jsx": "preserve",                                /* 指定 JSX 的处理方式。可选值包括 "preserve"、"react"、"react-jsx"、"react-jsxdev"、"react-native"。默认值为 "preserve"。 */
    // "experimentalDecorators": true,                   /*启用对遗留实验性装饰器的实验性支持。 */
    // "emitDecoratorMetadata": true,                    /* 为源文件中的修饰声明发出设计类型元数据。 */
    // "jsxFactory": "",                                 /* 指定针对React JSX emit时使用的JSX工厂函数,例如“React.createElement”或“h”。 */
    // "jsxFragmentFactory": "",                         /* 指定针对React JSX发射的片段时用于片段的JSX片段引用,例如“React.Fraggment”或“Fragment”。 */
    // "jsxImportSource": "",                            /*指定在使用“JSX:areact JSX*”时用于导入JSX工厂函数的模块说明符。 */
    // "reactNamespace": "",                             /* 指定为“createElement”调用的对象。这仅适用于以“反应”JSX发射为目标的情况。 */
    // "noLib": true,                                    /* 禁用包含任何库文件,包括默认的lib.d.ts。 */
    // "useDefineForClassFields": true,                  /* 发出符合ECMAScript标准的类字段。*/
    // "moduleDetection": "auto",                        /* 控制使用何种方法检测模块格式的JS文件。 */

    /* Modules */
    "module": "commonjs",                                /* 指定生成的模块代码。*/
    // "rootDir": "./",                                  /* 指定源文件中的根文件夹。 */
    // "moduleResolution": "node10",                     /* 指定TypeScript如何从给定的模块说明符中查找文件。 */
    // "baseUrl": "./",                                  /*  用于解析非相对模块名称的基本目录。默认值为 undefined。 */
    // "paths": {},                                      /* 指定模块名到基于 baseUrl 的路径映射。默认值为 undefined。 */
    // "rootDirs": [],                                   /* Allow multiple folders to be treated as one when resolving modules. */
    // "typeRoots": [],                                  /* Specify multiple folders that act like './node_modules/@types'. */
    // "types": [],                                      /* Specify type package names to be included without being referenced in a source file. */
    // "allowUmdGlobalAccess": true,                     /* Allow accessing UMD globals from modules. */
    // "moduleSuffixes": [],                             /* List of file name suffixes to search when resolving a module. */
    // "allowImportingTsExtensions": true,               /* Allow imports to include TypeScript file extensions. Requires '--moduleResolution bundler' and either '--noEmit' or '--emitDeclarationOnly' to be set. */
    // "resolvePackageJsonExports": true,                /* Use the package.json 'exports' field when resolving package imports. */
    // "resolvePackageJsonImports": true,                /* Use the package.json 'imports' field when resolving imports. */
    // "customConditions": [],                           /* Conditions to set in addition to the resolver-specific defaults when resolving imports. */
    // "resolveJsonModule": true,                        /* Enable importing .json files. */
    // "allowArbitraryExtensions": true,                 /* Enable importing files with any extension, provided a declaration file is present. */
    // "noResolve": true,                                /* Disallow 'import's, 'require's or '<reference>'s from expanding the number of files TypeScript should add to a project. */

    /* JavaScript Support */
    // "allowJs": true,                                  /* 允许JavaScript文件成为程序的一部分。使用“checkJS”选项可以从这些文件中获取错误。 */
    // "checkJs": true,                                  /* Enable error reporting in type-checked JavaScript files. */
    // "maxNodeModuleJsDepth": 1,                        /* Specify the maximum folder depth used for checking JavaScript files from 'node_modules'. Only applicable with 'allowJs'. */

    /* Emit */
    // "declaration": true,                              /* Generate .d.ts files from TypeScript and JavaScript files in your project. */
    // "declarationMap": true,                           /* Create sourcemaps for d.ts files. */
    // "emitDeclarationOnly": true,                      /* Only output d.ts files and not JavaScript files. */
    // "sourceMap": true,                                /* Create source map files for emitted JavaScript files. */
    // "inlineSourceMap": true,                          /* Include sourcemap files inside the emitted JavaScript. */
    // "outFile": "./",                                  /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */
    // "outDir": "./",                                   /* Specify an output folder for all emitted files. */
    // "removeComments": true,                           /* Disable emitting comments. */
    // "noEmit": true,                                   /* Disable emitting files from a compilation. */
    // "importHelpers": true,                            /* Allow importing helper functions from tslib once per project, instead of including them per-file. */
    // "importsNotUsedAsValues": "remove",               /* Specify emit/checking behavior for imports that are only used for types. */
    // "downlevelIteration": true,                       /* Emit more compliant, but verbose and less performant JavaScript for iteration. */
    // "sourceRoot": "",                                 /* Specify the root path for debuggers to find the reference source code. */
    // "mapRoot": "",                                    /* Specify the location where debugger should locate map files instead of generated locations. */
    // "inlineSources": true,                            /* Include source code in the sourcemaps inside the emitted JavaScript. */
    // "emitBOM": true,                                  /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */
    // "newLine": "crlf",                                /* Set the newline character for emitting files. */
    // "stripInternal": true,                            /* Disable emitting declarations that have '@internal' in their JSDoc comments. */
    // "noEmitHelpers": true,                            /* Disable generating custom helper functions like '__extends' in compiled output. */
    // "noEmitOnError": true,                            /* Disable emitting files if any type checking errors are reported. */
    // "preserveConstEnums": true,                       /* Disable erasing 'const enum' declarations in generated code. */
    // "declarationDir": "./",                           /* Specify the output directory for generated declaration files. */
    // "preserveValueImports": true,                     /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */

    /* Interop Constraints */
    // "isolatedModules": true,                          /* Ensure that each file can be safely transpiled without relying on other imports. */
    // "verbatimModuleSyntax": true,                     /* Do not transform or elide any imports or exports not marked as type-only, ensuring they are written in the output file's format based on the 'module' setting. */
    // "allowSyntheticDefaultImports": true,             /* Allow 'import x from y' when a module doesn't have a default export. */
    "esModuleInterop": true,                             /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */
    // "preserveSymlinks": true,                         /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
    "forceConsistentCasingInFileNames": true,            /* Ensure that casing is correct in imports. */

    /* Type Checking */
    "strict": true,                                      /* Enable all strict type-checking options. */
    // "noImplicitAny": true,                            /* Enable error reporting for expressions and declarations with an implied 'any' type. */
    // "strictNullChecks": true,                         /* When type checking, take into account 'null' and 'undefined'. */
    // "strictFunctionTypes": true,                      /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */
    // "strictBindCallApply": true,                      /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */
    // "strictPropertyInitialization": true,             /* Check for class properties that are declared but not set in the constructor. */
    // "noImplicitThis": true,                           /* Enable error reporting when 'this' is given the type 'any'. */
    // "useUnknownInCatchVariables": true,               /* Default catch clause variables as 'unknown' instead of 'any'. */
    // "alwaysStrict": true,                             /* Ensure 'use strict' is always emitted. */
    // "noUnusedLocals": true,                           /* Enable error reporting when local variables aren't read. */
    // "noUnusedParameters": true,                       /* Raise an error when a function parameter isn't read. */
    // "exactOptionalPropertyTypes": true,               /* Interpret optional property types as written, rather than adding 'undefined'. */
    // "noImplicitReturns": true,                        /* Enable error reporting for codepaths that do not explicitly return in a function. */
    // "noFallthroughCasesInSwitch": true,               /* Enable error reporting for fallthrough cases in switch statements. */
    // "noUncheckedIndexedAccess": true,                 /* Add 'undefined' to a type when accessed using an index. */
    // "noImplicitOverride": true,                       /* Ensure overriding members in derived classes are marked with an override modifier. */
    // "noPropertyAccessFromIndexSignature": true,       /* Enforces using indexed accessors for keys declared using an indexed type. */
    // "allowUnusedLabels": true,                        /* 禁用未使用标签的错误报告。 */
    // "allowUnreachableCode": true,                     /* 禁用无法访问的代码的错误报告 */

    /* Completeness */
    // "skipDefaultLibCheck": true,                      /* Skip type checking .d.ts files that are included with TypeScript. */
    "skipLibCheck": true                                 /* Skip type checking all .d.ts files. */
  }
}

常用配置

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "moduleResolution": "node",
    "strict": true,
    "noLib": false,
    "forceConsistentCasingInFileNames": true,
    "allowSyntheticDefaultImports": true,
    "strictFunctionTypes": false,
    "jsx": "preserve",
    "baseUrl": ".",
    "allowJs": true,
    "sourceMap": true,
    "esModuleInterop": true,
    "resolveJsonModule": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "experimentalDecorators": true,
    "lib": ["dom", "esnext"],
    "noImplicitAny": false,
    "skipLibCheck": true,
    "types": ["vite/client"],
    "removeComments": true,
    "paths": {
      "/@/*": ["src/*"],
      "/#/*": ["types/*"]
    }
  },
  "include": [
    "tests/**/*.ts",
    "src/**/*.ts",
    "src/**/*.d.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "types/**/*.d.ts",
    "types/**/*.ts",
    "build/**/*.ts",
    "build/**/*.d.ts",
    "mock/**/*.ts",
    "vite.config.ts"
  ],
  "exclude": ["node_modules", "tests/server/**/*.ts", "dist", "**/*.js"]
}

相关文章

网友评论

      本文标题:tsconfig.json应用

      本文链接:https://www.haomeiwen.com/subject/qekzmdtx.html