Vitest - ReferenceError:文件未定义

Question

我通常可以在代码中的任何地方使用File，但由于某种原因，当我最激烈地使用它时，它会抛出这个错误。为什么会发生这种情况，我如何解决这个错误？

这是我的vite.config.ts

/// <reference types="vitest" />
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

// Configure Vitest (https://vitest.dev/config/)
export default defineConfig({
  test: {
    /* for example, use global to avoid globals imports (describe, test, expect): */
    // globals: true,
  },
  plugins: [vue()],
})

这是我的测试文件代码。

import { assert, expect, test } from 'vitest'

test('File', () => {
  let applicationZip = new File(new Array<Blob>(), "Mock.zip", { type: 'application/zip' })
})

每当我运行最激烈的时候，它都会抛出以下错误。

ReferenceError: File is not defined
 ❯ test/basic.test.ts:25:23
     23| 
     24| test('File', () => {
     25|   let applicationZip = new File(new Array<Blob>(), "Mock.zip", { type: 'application/zip' })
       |                       ^
     26| })
     27| 

Answer 1

我通过here发现，File不是在nodejs中，而是由浏览器的DOM提供的，因此解释了最致命的错误，因为它是纯节点。通过更深入地阅读vitest的文档，我了解到可以使用像jsdom这样的环境来配置vitest，它将提供我在测试中需要的File对象。在使用以下环境设置修改我的vite.config.ts之后，该错误将不再出现。

/// <reference types="vitest" />
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

export default defineConfig({
  plugins: [vue()],
  test: {
    globals: true,
    environment: "jsdom",
  },
  root: ".",
})