xjq

Appearance

严格模式 ​

严格模式是引入一些限制来提高代码安全性和可维护性

  • 对于一些静默错误, 严格模式下会直接抛出错误
  • 严格模式修复了一些 Js 引擎难以执行优化的缺陷, 提升了性能
  • 严格模式禁用了新式语法

具体规则:

  • 禁止

tsconfig.json ​

json
// 当前配置为默认值
{
  // 相对路径或绝对路径的文件列表, 指定 tsc 编译器需要编译的文件列表
  "files": ["dir1/index.ts"],

  // 需要支持的文件列表, 支持 glob 通配符
  "include": ["dir2/**/*"],

  // 指定排除的文件列表, 但不能排除 files 直接指定的文件, 默认包含 node_modules
  "exclude": ["dir2/index2.ts"],

  // 从另一个文件继承配置
  "extends": "",

  // 编译配置
  "compileOptions": {
    "target": "es5",

    "jsx": "preserve",
    // 指定生成目标为 react JSX 时使用的 JSX 工厂函数
    "jsxFactory": "React.createElement",

    // 是否生成 sourcemap 文件
    "sourcemap": false,
    // 生成单个 sourcemap 文件, 需要开启 sourcemap 选项
    "inlineSourceMap": false,

    // 允许编译 js 文件
    "allowJs": false,

    // module === 'system' 或者设置了 esModuleInterop 且 module 不为 es2015/esnext
    // 允许从没有设置默认导出的模块中默认导入, 不影响代码输出, 仅作为类型检查
    "allowSyntheticDefaultImports": false,

    // 通过为导入内容创建命名空间, 实现 CommonJS 和 ES 模块之间的互操作性
    "esModuleInterop": false,

    // 不报告执行不到的代码错误
    "allowUnreachableCode": false,

    // 不报告未使用的标签错误
    "allowUnusedLabels": false,

    // 以严格模式解析, 并为每个源文件生成 "use strict" 语句
    "alwaysStrict": false,

    // 解析非相对模块名的基准目录
    "baseUrl": ".",

    // 输入文件的字符集
    "charset": "utf8",

    // 在 .js 文件中报告错误, 与 allowJs 配合使用
    "checkJs": false,

    // 生成相应的 .d.ts 文件
    "declaration": false,

    // 生成声明文件的输出路径
    "declarationDir": "",

    // 显示诊断信息
    "diagnostics": false,

    // 禁用 Js 工程体积大小的限制
    "disableSizeLimit": false,

    // 在输出文件的开头加入 BOM 头(UTF-8 Byte Order Mark), 用于标识文件编码格式
    "emitBOM": false,

    // 启用装饰器元数据的生成
    "emitDecoratorMetadata": false,
    // 启用实验性的ES装饰器
    "experimentalDecorators": false,

    // 不生成输出文件
    "noEmit": false,

    // 报错时不生成输出文件
    "noEmitOnError": false,

    // 在表达式和声明上有隐含的 any 类型时报错
    "noImplicitAny": false,

    // 不是函数的所有返回路径都有返回值时报错
    "noImplicitReturns": false,

    // 当 this 表达式的值为 any 类型时, 生成错误
    "noImplicitThis": false,

    // 不包含默认的库文件(lib.d.ts)
    "noLib": false,

    // 有未使用的局部变量则报错
    "noUnusedLocals": false,

    // 有未使用的参数则报错
    "noUnusedParameters": false,

    // 重定向输出目录, 不能和 outFile 同时使用
    "outDir": "dist",

    // 将输出文件合并为一个文件, 合并顺序根据传入编译器的文件顺序和 ///<reference``> 和 import 的文件顺序决定
    "outFile": "",

    // 模块别名配置
    "paths": {},

    // 是否保留 const 和 enum 声明, 用于优化输出或调试
    "preserveConstEnums": false,

    // 保留 watch 模式下过时的控制台输出
    "preserveWatchOutput": false,

    // 控制输出的目录结构, 例如: 当你的代码在 src 目录下, 输出会生成一层 src 目录, 将 rootDir 指定为 src 就可以去掉
    "rootDir": "",

    // 忽略所有声明文件(*.d.ts)的类型检查
    "skipLibCheck": false,

    // 禁用函数参数双向协变检查
    "strictFunctionTypes": false,

    // 确保类的非 undefined 属性已经在 构造函数里初始化, 需要同时启用 strictNullChecks
    "strictPropertyInitialization": false,
    // 在严格的 null 检查模式下, null 和 undefined 值不包含在任何类型里, 只允许用它们自己和 any 来赋值(undefined 可以 复制 void)
    "strictNullChecks": false
  }
}

compileOptions ​

  • target

    编译 Js 的版本, 默认为 ES3

    • ES3: 最广泛支持的版本
    • ES5: 大多数现代浏览器支持
    • ES6/ES2015: 引入了类、模块、箭头函数、Promise等新特性
    • ES7/ES2016: 引入了 Array.prototype.includes 和幂运算符
    • ES8/ES2017: 引入了 async/await
    • ES9/ES2018: 引入了异步迭代等特性
    • ES10/ES2019: 引入了 Array.prototype.flat 和 Object.fromEntries
    • ES11/ES2020: 引入了可选链和空值合并运算符
    • ES12/ES2021: 引入了 Promise.any 和逻辑赋值运算符
    • ES13/ES2022: 引入了类字段和顶级 await
    • ESNext: 编译为最新的 ECMAScript 版本, 包含所有新特性

  • jsx

    如何处理 JSX 语法

    • preserve: 保留 JSX 语法, 不进行转换, 通常与 babel 等工具链结合使用
    • react: 将 JSX 转换为 React.createElement 调用
    • react-jsx: 将 JSX 转换为 新的 JSX 转换器(React 17 及以上版本引入), 不再需要显式导入 React
    • react-jsxdev: 与 react-jsx 类似, 但用于开发模式, 提供额外的调试信息

  • module

    指定 TS 编译器生成的模块系统类型

    • commonjs: 适用于 Node.js 环境
    • es6/es2015: 使用 ES6 模块语法
    • esnext: 与 es6 类似, 但允许使用最新的 es 模块特性
    • amd: 异步模块定义, 主要用于浏览器环境, 使用 define 和 require
    • umd: 通用模块定义, 兼容 CommonJS 和 AMD, 适用于库的开发
    • system: 使用 SystemJS 模块加载器的模块格式
    • none: 不使用任何模块系统, 所有代码视为全局脚本

:name

Copyright © 2019-present xjq