共计 字 • 阅读约 min

起因

想在 vitest 中使用 jsx 测试组件, 安装 @vitejs/plugin-vue-jsx 后报错

image1664165640187.png

报错内容

TypeError: vite.createFilter is not a function
-    at vueJsxPlugin (/Users/dh/Desktop/code/vue3-baidu-map/node_modules/.pnpm/@vitejs+plugin-vue-jsx@2.0.1_vite@2.9.12+vue@3.2.37/node_modules/@vitejs/plugin-vue-jsx/dist/index.cjs:47:23)
    at Object.<anonymous> (/Users/dh/Desktop/code/vue3-baidu-map/vitest.config.ts:32:81)
    at Module._compile (node:internal/modules/cjs/loader:1101:14)
    at Object.require.extensions.<computed> [as .ts] (/Users/dh/Desktop/code/vue3-baidu-map/node_modules/.pnpm/vite@2.9.12/node_modules/vite/dist/node/chunks/dep-8f5c9290.js:61963:20)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at loadConfigFromBundledFile (/Users/dh/Desktop/code/vue3-baidu-map/node_modules/.pnpm/vite@2.9.12/node_modules/vite/dist/node/chunks/dep-8f5c9290.js:61971:17)
    at loadConfigFromFile (/Users/dh/Desktop/code/vue3-baidu-map/node_modules/.pnpm/vite@2.9.12/node_modules/vite/dist/node/chunks/dep-8f5c9290.js:61890:32)

分析

通过观察报错信息, 猜测可能是 vite 版本不匹配导致, 项目中用的 vite 版本是 2.9.12, 而 @vitejs/plugin-vue-jsx 中使用的 vite 是 3.0.0

解决

  1. 升级项目中的 vite 版本 2.x => 3.x
  2. 降级 @vitejs/plugin-vue-jsx


文章更新于: 2022-9-26 12:53:32