迹忆客 专注技术分享

当前位置:主页 > 学无止境 >

如何生成 tsconfig.json 文件

作者:迹忆客 最近更新:2022/10/01 浏览次数:

要生成 tsconfig.json 文件:

  1. 在项目的根目录中打开终端。
  2. 全局安装 typescript:npm install typescript@latest -g
  3. 通过运行生成一个 tsconfig 文件: tsc --init

在项目的根目录(package.json 文件所在的位置)中打开终端并运行以下命令:

# 👇️ 全局安装 typescript
$ npm install typescript@latest -g

# 👇️ 生成 tsconfig.json 文件
$ tsc --init

第一个命令全局安装最新版本的 typescript 包,第二个命令生成一个 tsconfig.json 文件。

如果 typescript 的全局安装失败,我们可能必须运行以 sudo 为前缀的命令。

# 👇️ 如果遇到权限错误,请使用 sudo 运行
$ sudo npm install typescript@latest -g

$ tsc --init

如果我们能够运行 tsc --version 命令并获取 typescript 包的版本号,则安装成功。

$ tsc --version

typescript 版本

或者,我们可以在本地安装 typescript 并从本地安装生成 tsconfig.json 文件。

# 👇️ 本地安装 typescript
$ npm install --save-dev typescript

# 👇️ 生成 tsconfig.json 文件
$ tsc --init

tsc --init 命令生成一个 tsconfig.json 文件,表示该目录是 TypeScript 项目的根目录。

默认的 tsconfig.json 文件在 compilerOptions 对象中设置了一些选项,并对每个选项的作用进行了注释。

如果我们需要更改默认配置,我们可以通过访问 tsconfig.json 参考页面获取有关每个选项的更多信息。

例如,如果我们正在为 Node.js 项目生成 tsconfig.json,那么我们的文件最终可能会如下所示:

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "moduleResolution": "node",
    "rootDir": "src",
    "outDir": "build",
    "lib": ["ES2022"],
    "strict": true,
    "esModuleInterop": true,
    "allowJs": true,
    "checkJs": false,
    "resolveJsonModule": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules"]
}

此配置假定我们在项目的根目录中有一个 src 目录。

我们可以在 src 目录中创建一个 index.ts 文件并运行 tsc src/index.ts 命令将其转换为 JavaScript。

上面的示例使用 include 选项指定要包含在代码库中的模式。

文件名或指定模式是相对于目录解析的,该目录包含您的 tsconfig.json 文件。

exclude 数组包含解析包含数组时应跳过的文件名或模式。

exclude 选项改变了 include 选项找到的内容,有效地从编译中过滤掉一些文件夹或文件。

如果我们没有在 tsconfig.json 文件中显式添加排除数组,则它默认为 node_modulesbower_componentsjspm_packages

target 选项设置发出的 JavaScript 文件的语言版本。

所有现代浏览器(和 Node.js)都支持所有 ES6 功能。例如,当您的目标选项设置为早于 {' '} es6(例如 es5)时,TypeScript 必须将我们的类转换为函数。

我们可以在 tsconfig.json 参考页面中阅读有关每个选项的更多信息。

转载请发邮件至 1244347461@qq.com 进行申请,经作者同意之后,转载请以链接形式注明出处

本文地址:

相关文章

在 TypeScript 中返回一个 Promise

发布时间:2023/03/19 浏览次数:182 分类:TypeScript

本教程讨论如何在 TypeScript 中返回正确的 Promise。这将提供 TypeScript 中 Returns Promise 的完整编码示例,并完整演示每个步骤。

扫一扫阅读全部技术教程

社交账号
  • https://www.github.com/onmpw
  • qq:1244347461

最新推荐

教程更新

热门标签

扫码一下
查看教程更方便