我刚刚让它在 Vue3/Vuetify3 上运行。简而言之（使用 pnpm、vite、typescript、Vue 插件）：

将组件创建为新项目：

pnpm create vue@latest
-> your-plugin
-> Typescript
-> ESLint
cd <project>
echo auto-install-peers = true > .npmrc
pnpm add -D vuetify rollup-plugin-typescript2

然后删除所有组件并创建自己的组件。 创建 src\components\index.ts 和 src\YourPlugin.ts

src\components\index.ts

export {default as YourComponent} from "./YourComponent.vue"

src\YourPlugin.ts

import type { App } from "vue"
import { YourComponent } from "./components"
export default {
    install: (app: App) => {
        app.component("YourComponent", YourComponent)
    }
};

vite.config.ts

添加到 imports :

import vuetify from 'vite-plugin-vuetify'
import typeScript2 from "rollup-plugin-typescript2"

添加到 plugins :

vuetify({
  autoImport: true,
}),
typeScript2({
  check: false,
  include: ["src/components/*.vue"],
  tsconfigOverride: {
    compilerOptions: {
      sourceMap: true,
      declaration: true,
      declarationMap: true,
    }
  },
  exclude: [
    "vite.config.ts"
  ]
})

向 defineConfig 添加新的部分 build :

  build: {
    cssCodeSplit: false,
    lib: {
      entry: "./src/YourPlugin.ts",
      formats: ["es", "cjs"],
      name: "CommonVtfyPlugin",
      fileName: format => (format == "es" ? "index.js" : "index.cjs"),
    },
    rollupOptions: {
      external: ["vue", "vuetify/lib"],
      output: {
        globals: {
          vue: "Vue",
          vuetify: "Vuetify",
            'vuetify/components': 'VuetifyComponents',
            'vuetify/directives': 'VuetifyDirectives'
        }
      }
    }
  },

dist\index.d.ts

我还没有弄清楚如何生成它。但这是一个通用的替代品：

declare const _default: any;
export default _default;

package.json

添加这个：

"type": "module",
  "exports": {
    ".": "./dist/index.js"
  },
  "types": "./dist/index.d.ts",
  "files": [
    "dist"
  ],

您可以通过将其作为插件导入在任何 Vue 项目中使用它：

import YourComponent from 'your-plugin'
app.use(YourComponent)

不保证优化程度（欢迎反馈）..但它有效（tm）.. 可以在 pnpm monorepo：如何设置一个简单的可重用（vue）组件以供重用？ （如果有任何更新，也将主要在该答案中更新）