VUE3中全局引入和局部引入，组件自动引入 三种不同方式引入规则的学习

在根目录中新建myComponent/navbar/navbar.vue文件

①全局引入 在main.js中

import  Component  from './myComponent/navbar/navbar.vue'

export function createApp() {
  const app = createSSRApp(App)
  app.component('my-component',Component)
  return {
    app
  }
}

在app中就可以将Component关联成组件，名字叫做“my-component”

这样，在全局的页面中即可使用<my-component></my-component>

②局部引入

直接在需要使用的页面中写入

import  myComponent from '../../myComponent/navbar/navbar.vue'

就可以直接在该页面使用<myComponent></myComponent>组件

③组件自动引入

全局文件的pages.json文件中，有一个easycom属性。

要求在根目录的components（名字不能错）文件下完成，点击新建组件navbar.vue。

这样新建的组件可以直接在页面中使用<navbar/>