錯誤 TS2430：接口“WebGLRenderingContext”錯誤地擴展了接口“WebGLRenderingContextBase”

Question

當我運行tsc它給了我這個錯誤輸出：

../../../AppData/Roaming/npm/node_modules/typescript/lib/lib.dom.d.ts(15340,11): error TS2430: Interface 'WebGLRenderingContext' incorrectly extends interface 'WebGLRenderingContextBase'.
  Types of property 'getExtension' are incompatible.
    Type '{ (name: "ANGLE_instanced_arrays"): ANGLEInstancedArrays; (name: "EXT_blend_minmax"): EXTBlendMinMax; (name: "EXT_color_buffer_half_float"): EXTColorBufferHalfFloat; (name: "EXT_frag_depth"): EXTFragDepth; (name: "EXT_sRGB"): EXTsRGB; (name: "EXT_shader_texture_lod"): EXTShaderTextureLOD; (name: "EXT_texture_filter_...' is not assignable to type '{ (extensionName: "EXT_blend_minmax"): EXT_blend_minmax | null; (extensionName: "EXT_texture_filter_anisotropic"): EXT_texture_filter_anisotropic | null; (extensionName: "EXT_frag_depth"): EXT_frag_depth | null; (extensionName: "EXT_shader_texture_lod"): EXT_shader_texture_lod | null; (extensionName: "EXT_sRGB"): EX...'.
      Types of parameters 'name' and 'extensionName' are incompatible.
        Type '"OES_vertex_array_object"' is not assignable to type '"ANGLE_instanced_arrays"'.

我的tsconfig.json ：

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "rootDir": "src",
    "outDir": "dist",
    "strict": true,
    "esModuleInterop": true,
    "sourceMap": true,
    "declaration": true
  },
  "exclude": [
    "node_modules",
    "dist"
  ]
}

tsc是版本Version 3.1.3 。

這是我的package.json ：

{
  "name": "pupp-tf-test",
  "version": "0.0.1",
  "description": "Try to get environment set up to program using TypeScript, Puppeteer, and TensorFlow.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "xiaodeaux",
  "license": "ISC",
  "dependencies": {
    "@tensorflow/tfjs-node-gpu": "^0.1.18"
  },
  "devDependencies": {
    "@types/node": "^10.12.0"
  }
}

我唯一的.ts文件是空的。 所以這與文件中的代碼無關，因為沒有。 至少我認為它與該特定文件無關。

另外，我在 Windows 10 上使用 Visual Studio Code。 這是 vscode 環境信息：

Version: 1.28.1 (user setup)
Commit: 3368db6750222d319c851f6d90eb619d886e08f5
Date: 2018-10-11T18:13:53.910Z
Electron: 2.0.9
Chrome: 61.0.3163.100
Node.js: 8.9.3
V8: 6.1.534.41
Architecture: x64

Answer 1

看起來@types/webgl-ext包（ @tensorflow/tfjs-node-gpu的間接依賴項）包含WebGLRenderingContext的getExtension方法的聲明，該聲明與最近版本的WebGLRenderingContextBase的getExtension方法的聲明不兼容TypeScript 標准庫。 我不知道應該怎樣做這件事，所以我建議你先文件中的問題對@types/webgl-ext 。 如果您在那里沒有得到答案，那么您可以升級到 TensorFlow.js 支持資源，詢問是否可以刪除對已損壞且明顯未維護的包的依賴。

同時，一種可行的解決方法是創建您自己的空的@types/webgl-ext包的虛擬版本。 在您的項目中創建一個目錄來保存虛擬包（例如，假設您將目錄命名為webgl-ext ），從真實的@types/webgl-ext包中復制package.json ，創建一個空的index.d.ts文件，然后使用相對路徑在主package.json注冊虛擬包：

  "dependencies": {
    "@tensorflow/tfjs-node-gpu": "^0.1.18",
    "@types/webgl-ext": "./webgl-ext"
  },

Answer 2

根據@tafsiri on tfjs issue: Compile error with @tensorflow/tfjs-backend-webgl問題是： “由 webgl 現在內置類型和我們當前使用的 @types/webgl2 包之間的沖突引起” 。

他給出了下一個解決方案（對我有用）：

• 編輯您的文件tsconfig.json並添加選項skipLibCheck

   { "compilerOptions": { ... // skip error: Interface 'WebGL2RenderingContext' incorrectly extends interface 'WebGL2RenderingContextBase'. // https://github.com/tensorflow/tfjs/issues/4201 "skipLibCheck": true }, ... }