以下純個(gè)人理解 歡迎 大佬指正
1.【vue 2.0】
http-vue-loader.js
原生html需要引入以上js
// 使用httpVueLoader

Vue.use(httpVueLoader);
new Vue({
    el: '#app',
    data: function () {
        return { visible: false }
    },
    components: {
        // 將組建加入組建庫
        'my-component': 'url:./component/my-component.vue'
    }
})

2.【vue 3.0】
組件的理解可以在各個(gè)js中 當(dāng)函數(shù)使用
function fun1(id){
const Counter = {
data() {
return {
counter: "反轉(zhuǎn)字符"
}
},
components:{
// "button-counter":app1
},
mounted(){
this.changeData();

    },
    methods:{
        changeData(){//更新data
            setTimeout(()=>{
                    this.counter = "更新"
            },3000)
        },
        reverseMessage(){
            this.counter = this.counter.split("").reverse().join("")
        }
    }
}
Vue.createApp(Counter).mount("#"+id);

}