VS中TypeScript扩展构建失败，但Angular CLI中可正常运行

我之前也碰到过类似的情况——Angular CLI能正常构建，但Visual Studio里TypeScript编译报错，大概率是全局扩展的作用域处理和TS配置差异导致的，结合你的代码咱们一步步解决：

1. 先修正代码里的拼写错误 #

你的代码最后一行array[currentIndex] = array[randomInde...明显是拼写失误，应该是randomIndex，这个小问题也可能触发VS的编译报错，先补上完整代码：

interface Array<T> {
  randomize(): this;
}

Array.prototype.randomize = function () {
  var array = this;
  var currentIndex = array.length, temporaryValue, randomIndex;

  // While there remain elements to shuffle...
  while (0 !== currentIndex) {
    // Pick a remaining element...
    randomIndex = Math.floor(Math.random() * currentIndex);
    currentIndex -= 1;

    // And swap it with the current element.
    temporaryValue = array[currentIndex];
    array[currentIndex] = array[randomIndex];
    array[randomIndex] = temporaryValue;
  }

  return array;
};

2. 处理全局扩展的模块作用域问题 #

如果你的ArrayHelper.ts文件里有import或export语句，TS会把它视为模块，此时你在里面扩展的Array接口会被限制在模块内部，而非全局的Array接口。Visual Studio的TS编译器会严格校验这一点，而Angular CLI的构建流程可能自动处理了全局类型合并。

解决方式分两种：

• 如果这个文件不需要作为模块（没有import/export需求），直接删除所有import/export语句，让它成为全局脚本文件。
• 如果必须保留模块（比如要导出其他工具函数），就把接口扩展放在global声明块中：

declare global {
  interface Array<T> {
    randomize(): this;
  }
}

Array.prototype.randomize = function () {
  // 洗牌逻辑...
  return this;
};

// 若需导出其他内容，在此添加即可
// export const someOtherHelper = ...;

3. 把扩展移到类型声明文件中（推荐） #

Visual Studio对.d.ts类型声明文件的处理更友好，建议你把Array的接口扩展单独放在一个声明文件里，比如src/types/array-extensions.d.ts：

interface Array<T> {
  randomize(): this;
}

然后在ArrayHelper.ts里只保留原型方法的实现逻辑。同时确保tsconfig.json的include字段包含这个类型文件的路径：

{
  "include": [
    "src/**/*.ts",
    "src/types/**/*.d.ts"
  ]
}

4. 对齐Visual Studio与项目的TypeScript版本 #

有时候VS默认使用的TS版本和Angular CLI依赖的TS版本不一致，会导致编译行为差异。你可以通过工具 > 选项 > 文本编辑器 > JavaScript/TypeScript > IntelliSense查看当前VS使用的TS版本，选择"使用项目版本"来对齐项目依赖的TS版本。

按照上面的步骤调整后，Visual Studio的构建应该就能正常通过了，同时也能保持Angular CLI的正常运行。

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