属性 'text' 在类型 'File' 上不存在

Question

我有以下代码来处理用户的文件上传：

17  const onFileDrop =
18    (files: File[]) => {
19      files.forEach(file => file.text().then(content => console.log(content)));
20    },
21  );

VS Code 没有显示任何错误，我可以正确访问包含 text() 函数的 File 界面。

但是，当运行 npm start 我看到以下错误：

[tsl] ERROR in {omitted}/RawCommandOutputs.tsx(19,34)
      TS2339: Property 'text' does not exist on type 'File'.


[tsl] ERROR in {omitted}/RawCommandOutputs.tsx(19,46)
      TS7006: Parameter 'content' implicitly has an 'any' type.

Answer 1

行为差异是由于 webpack 和 VS Code 使用的 Typescript 版本不同。

该项目依赖于 Typescript 版本 3.5.2。在此版本中，File 接口不包含 text() 函数。因此，运行 npm start 显示了上述错误。

VS Code 似乎默认使用最新版本的 Typescript（在我的例子中是 3.9.5），其中包含更新的 File 界面。

为了使 VS Code 使用与我的项目相同版本的 Typescript，我添加了
"typescript.tsdk": "./node_modules/typescript/lib" 到我的 settings.json 文件。然后，我运行 Select Typescript Version 命令并选择 Use Workspace Version 选项。

属性 'text' 在类型 'File' 上不存在

Property 'text' does not exist on type 'File'

typescript

eslint

visual-studio-code

webpack-encore

typescript-eslint