“文件”类型上不存在属性“文本”

Question

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

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

VS Code 没有显示任何错误，我可以正常访问File 接口，其中包含text() 函数。

但是，在运行 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 选项。