运行typescript 文件-TypeScript 配置 VSCode 使用 PnP for Yarn2 运行 TypeS

也想出现在这里？点击联系我~

立即下单

进入商城

进不了网站？换个网络试试！

第1步：安装VSCode和Yarn2

首先运行typescript 文件，确保您已经安装了最新版本的 VSCode 和 Yarn2。 您可以从官方网站下载并按照安装说明进行安装。 安装完成后，确保可以从命令行运行yarn命令。

第 2 步：创建 TypeScript 项目

在 VSCode 中，打开一个文件夹，然后打开一个终端。 在终端中，运行以下命令来初始化新的 TypeScript 项目：

yarn init -y

这将创建一个新的 package.json 文件，其中包含有关项目的基本信息。

第3步：安装TypeScript及相关依赖项

在终端中，继续运行以下命令来安装 TypeScript 和其他相关依赖项：

yarn add -D typescript ts-node @types/node

上面的命令将安装 TypeScript 编译器、ts-node 工具以及一些用于 Node.js 开发的类型定义。

步骤 4：创建 TypeScript 配置文件

在项目的根目录中，创建一个名为 tsconfig.json 的文件并向其中添加以下内容：

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "rootDir": "src",
    "outDir": "dist",
    "esModuleInterop": true
  },
  "include": ["src/**/*.ts"]
}

上面的配置文件指定了 TypeScript 编译器的选项。 您可以根据您的项目需要进行调整。

第五步：配置VSCode启动任务

在 VSCode 中，按 Ctrl+Shift+B，然后选择“配置任务”。 从弹出菜单中选择“终端：运行任务”。 这将在项目文件夹中创建一个 .vscode 文件夹运行typescript 文件，并在其中创建一个名为tasks.json 的文件。 将以下内容粘贴到tasks.json文件中：

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "运行TypeScript",
      "type": "shell",
      "command": "./node_modules/.bin/ts-node",
      "args": ["{file}"],
      "presentation": {
        "echo": true,
        "reveal": "always",
        "focus": true,
        "panel": "shared",
        "showReuseMessage": true,
        "clear": true
      },
      "problemMatcher": ["tsc"],
      "group": "build"
    }
  ]
}

上面的配置将创建一个名为“Run TypeScript”的任务并将其显示在侧边栏中。 当您按 Ctrl+Shift+B 时，将运行当前打开的 TypeScript 文件。

第 6 步：运行 TypeScript 代码

今天，您可以在 VSCode 中打开 TypeScript 文件，然后按 Ctrl+Shift+B 来运行它。 VSCode 将使用 Yarn2 的 PnP 功能执行 TypeScript 代码。

下面是复制“Hello, TypeScript!”的示例 TypeScript 代码。 到控制台：

console.log("Hello, TypeScript!");

保存并运行此代码，您将在控制台上看到输出：“Hello, TypeScript!”。

总结

按照上述步骤，就可以成功配置VSCode使用PnP运行Yarn2的TypeScript代码了。 TypeScript提供了更强大的类型检测和开发工具，而Yarn2的PnP功能可以提升包管理和依赖解析的速度。 在开发小型 TypeScript 项目时，这些配置将帮助您更有效地编写和调试代码。 快乐编程！