vue组件化开发

 写好的模块组件vue文件放在components文件下

1、模块组件之间的引用

        假设App.vue里引用hello.vue组件：

                1）写好hello.vue文件后

                2）在App.vue里

<script>
1、先导入 写好的组件
    import Hello from './componets/Hello.vue'
2、在components属性里添加组件
	export default{
		name:'App',
		components:{
			Hello
		}
	}
</script>

3、再去App.vue里使用
<template>
  <Hello></Hello>
</template>

 2、渲染

在main.js文件里如果导入了组件，并挂载在html标签上，那么在html页面就可以渲染

         1）在main.js里先导入

vue2的语法
import Vue from 'vue'
import App from './App.vue'

new Vue({
  router,
  render: h => h(App)
}).$mount('#app')

vue3的语法
import {createApp} from 'vue'
import App from './App.vue'


createApp(App).mount('#app')//括号里的App，只要和import第二句的对应就可以

         2）在index.html页面的标签进行绑定id，就可以使用