Vue3 升级 - 错误：[插件：vite：dep-scan] 无法读取未定义的属性（读取“长度”）

Question

我在 vue2 项目中成功从 webpack 迁移到 vite，现在我正在从 vue2 升级到 vue3。

\n

我直到本指南中的步骤 4： https: //v3-migration.vuejs.org/migration-build.html#installation为止，现在构建过程给了我这个错误。

\n

ERROR: [plugin: vite:dep-scan] Cannot read properties of undefined (reading \'length\')

\n

看起来 vite compat 构建器找不到该文件/src/main.js，因为如果我重命名甚至删除该文件，错误仍然存​​在。

\n

我错过了什么？

\n

\xe2\x9c\x98 [ERROR] [plugin vite:dep-scan] Cannot read properties of undefined (reading \'length\')\n\n    node_modules/vite/dist/node/chunks/dep-59dc6e00.js:60384:34:\n      60384 \xe2\x94\x82     if (importee.length < pattern.length) {\n            \xe2\x95\xb5                                   ^\n\n    at matches (/home/user/projects/ipfs-search/dweb-search-frontend/node_modules/vite/dist/node/chunks/dep-59dc6e00.js:60384:35)\n    at /home/user/projects/ipfs-search/dweb-search-frontend/node_modules/vite/dist/node/chunks/dep-59dc6e00.js:60443:58\n    at Array.find (<anonymous>)\n    at Context.resolveId (/home/user/projects/ipfs-search/dweb-search-frontend/node_modules/vite/dist/node/chunks/dep-59dc6e00.js:60443:42)\n    at Object.resolveId (/home/user/projects/ipfs-search/dweb-search-frontend/node_modules/vite/dist/node/chunks/dep-59dc6e00.js:38837:55)\n    at processTicksAndRejections (node:internal/process/task_queues:96:5)\n    at async resolve (/home/user/projects/ipfs-search/dweb-search-frontend/node_modules/vite/dist/node/chunks/dep-59dc6e00.js:39049:26)\n    at async /home/user/projects/ipfs-search/dweb-search-frontend/node_modules/vite/dist/node/chunks/dep-59dc6e00.js:39257:34\n    at async callback (/home/user/projects/ipfs-search/dweb-search-frontend/node_modules/esbuild/lib/main.js:929:28)\n    at async handleRequest (/home/user/projects/ipfs-search/dweb-search-frontend/node_modules/esbuild/lib/main.js:709:30)\n\n  This error came from the "onResolve" callback registered here:\n\n    node_modules/vite/dist/node/chunks/dep-59dc6e00.js:39253:18:\n      39253 \xe2\x94\x82             build.onResolve({\n            \xe2\x95\xb5                   ~~~~~~~~~\n\n    at setup (/home/user/projects/ipfs-search/dweb-search-frontend/node_modules/vite/dist/node/chunks/dep-59dc6e00.js:39253:19)\n    at handlePlugins (/home/user/projects/ipfs-search/dweb-search-frontend/node_modules/esbuild/lib/main.js:851:23)\n    at Object.buildOrServe (/home/user/projects/ipfs-search/dweb-search-frontend/node_modules/esbuild/lib/main.js:1145:7)\n    at /home/user/projects/ipfs-search/dweb-search-frontend/node_modules/esbuild/lib/main.js:2087:17\n    at new Promise (<anonymous>)\n    at Object.build (/home/user/projects/ipfs-search/dweb-search-frontend/node_modules/esbuild/lib/main.js:2086:14)\n    at Object.build (/home/user/projects/ipfs-search/dweb-search-frontend/node_modules/esbuild/lib/main.js:1935:51)\n    at /home/user/projects/ipfs-search/dweb-search-frontend/node_modules/vite/dist/node/chunks/dep-59dc6e00.js:38997:54\n    at Array.map (<anonymous>)\n\n  The plugin "vite:dep-scan" was triggered by this import\n\n    html:/home/user/projects/ipfs-search/dweb-search-frontend/index.html:1:7:\n      1 \xe2\x94\x82 import "/src/main.js"\n        \xe2\x95\xb5        ~~~~~~~~~~~~~~\n\nBuild failed with 1 error:\nnode_modules/vite/dist/node/chunks/dep-59dc6e00.js:60384:34: ERROR: [plugin: vite:dep-scan] Cannot read properties of undefined (reading \'length\')\n

\n

vite.config.js：

\n

import { defineConfig } from \'vite\';\nimport path from \'path\';\nimport createVuePlugin from \'@vitejs/plugin-vue\';\n\nexport default defineConfig({\n  plugins: [\n    createVuePlugin({\n      template: {\n        compilerOptions: {\n          compatConfig: {\n            MODE: 2,\n          },\n        },\n      },\n    }),\n  ],\n  server: {\n    port: 8080,\n  },\n  resolve: {\n    alias: [\n      {\n        vue: \'@vue/compat\',\n      },\n      {\n        find: \'@\',\n        replacement: path.resolve(__dirname, \'src\'),\n      },\n    ],\n  },\n});\n

\n

Answer 1

受到 Frido Emans 回答的启发，我发现问题是使用列表到alias. 我最终更换了

export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: [
      {
        "@": fileURLToPath(new URL("./src", import.meta.url)),
      },
      {
        find: "./runtimeConfig",
        replacement: "./runtimeConfig.browser",
      },
    ]
  },
});

by（注意别名列表消失了）

export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
        "./runtimeConfig": "./runtimeConfig.browser",
        "@": fileURLToPath(new URL("./src", import.meta.url))
    }
  },
});