一、新建项目：saas-plugin

目录：/components/button-input/ButtonInput.vue

<template>
	<el-space wrap>
		<el-button type="primary" @click="add">点击</el-button>
		<el-input :model-value="count"></el-input>
	</el-space>
</template>

<script>
 export default {
 	data() {
 		return {
 			count: 1
 		}
 	},
	methods: {
		add() {
			this.count++;
		}
	},
 }
</script>

<style>
</style>

目录：/components/button-input/index.ts

import { App } from "vue";
import ButtonInput from './ButtonInput.vue'

export default{
    install(app:App){
        app.component('button-input',ButtonInput)
    }
}

目录：/components/index.ts

import { App } from "vue";
import ButtonInput from "./button-input";

const components = [
  ButtonInput
];

export default {
  install(app: App) {
    components.map((item) => {
      app.use(item);
    });
  },
};

二、全局引用

main.js

import { createApp } from 'vue'
import App from './App.vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import CustomComponents from '/src/components'

var app= createApp(App);
app.use(ElementPlus);

/*自定义的组件全局引用*/
app.use(CustomComponents);

app.mount('#app');

App.vue

<script setup>
</script>

<template>
  <button-input></button-input>
</template>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>

运行效果：