Vue3+Vuetify+Vite组件库构建与跨项目引入报错求助

1. 修正外部化依赖配置 #

首先移除rollupOptions.external中的@vuetify/loader-shared——这个包是Vuetify的构建时依赖，不是组件库运行时需要的依赖，外部化它会导致消费项目无法找到对应的环境支持。

修改后的build.rollupOptions：

rollupOptions: {
  external: ["vue", "vuetify"], // 只保留运行时必需的依赖
}

2. 正确配置Node模块Polyfill #

你已经使用了vite-plugin-node-polyfills，但需要调整配置确保它正确处理node:module这类协议导入：

nodePolyfills({
  protocolImports: true,
  include: ['module'], // 明确指定需要polyfill的node模块
})

同时，在resolve.alias中添加对node:module的别名映射，确保Rollup能找到对应的polyfill：

resolve: {
  alias: {
    "@": fileURLToPath(new URL("./src", import.meta.url)),
    'node:module': 'node-stdlib-browser/esm/module.js',
  },
  extensions: [".mjs", ".js", ".mts", ".json", ".jsx", ".ts", ".tsx", ".vue"],
}

3. 排查Vuetify自动导入的影响 #

如果启用了vuetify({ autoImport: true })，可能会意外引入构建时代码到运行时。尝试临时关闭autoImport，手动导入所需的Vuetify组件，验证是否还会出现错误：

vuetify({
  autoImport: false, // 临时关闭
}),

如果问题消失，说明是自动导入逻辑导致的，建议升级到最新版本的vite-plugin-vuetify，或者在autoImport中添加更精确的规则避免引入构建依赖。

4. 升级依赖版本 #

检查并升级以下依赖到最新稳定版，可能已经修复了node:module导入的兼容性问题：

• @vuetify/loader-shared
• vite-plugin-vuetify
• vuetify

执行升级命令：

npm update vuetify vite-plugin-vuetify @vuetify/loader-shared

验证构建与消费 #

完成上述配置后，重新执行build命令，确认无报错。然后将组件库导入到消费项目，运行dev查看是否解决了控制台的createRequire is not a function错误。

内容的提问来源于stack exchange，提问作者ToliNY