同时安装vss-web-extension-sdk与azure-pipelines-task-lib时Typescript编译报错如何解决

问题根因 #

你遇到的编译报错是类型声明冲突导致的：vss-web-extension-sdk自带的RequireJS浏览器端类型声明，和azure-pipelines-task-lib依赖的Node.js全局类型里的require、module定义重复，你在tsconfig中全局引入了vss的类型，而管道任务是运行在Node.js环境下的，不需要全局加载浏览器端的类型定义。

可直接复用的配置方案 #

方案一：项目仅开发管道任务，vss-web-extension-sdk为附属依赖 #

直接修改tsconfig.json即可，修改后内容如下：

{
    "compilerOptions": {
        "module": "commonjs",
        "moduleResolution": "node",
        "target": "es6",
        "rootDir": "src/",
        "outDir": "dist/",
        "types": ["node"],
        "skipLibCheck": true
    },
    "files": [
        "src/index.ts"
    ]
}

配置说明：

• types字段只保留node，不再全局加载vss-web-extension-sdk的类型，避免冲突。如果局部文件需要调用vss-sdk，手动在文件顶部加/// <reference types="vss-web-extension-sdk" />即可。
• skipLibCheck会跳过node_modules下所有第三方库的类型检查，不会影响你自己编写的代码的类型校验，是解决这类第三方库类型冲突的通用方案。

方案二：同一个项目需要同时开发管道任务 + Azure DevOps扩展前端 #

你可以拆分多份tsconfig配置，分别对应不同运行环境的代码：

1. 管道任务代码统一放在tasks/目录，使用Node环境专属配置
2. 扩展前端代码统一放在web/目录，使用浏览器环境专属配置

根目录tsconfig.json（公共配置）

{
    "compilerOptions": {
        "target": "es6",
        "moduleResolution": "node",
        "skipLibCheck": true
    },
    "references": [
        { "path": "./tasks/tsconfig.json" },
        { "path": "./web/tsconfig.json" }
    ]
}

tasks/tsconfig.json（管道任务专属配置）

{
    "compilerOptions": {
        "module": "commonjs",
        "rootDir": "./",
        "outDir": "../dist/tasks",
        "types": ["node"]
    },
    "include": ["**/*.ts"]
}

web/tsconfig.json（前端扩展专属配置）

{
    "compilerOptions": {
        "module": "amd",
        "rootDir": "./",
        "outDir": "../dist/web",
        "types": ["vss-web-extension-sdk"]
    },
    "include": ["**/*.ts"]
}

编译时执行tsc --build即可同时编译两个环境的代码。

内容的提问来源于stack exchange，提问作者MrDuncan