通常一个项目中有很多固定的配置需要全局进行使用，或者一个全局很多地方都能用到的函数，如果在每个组件中都重新定义赋值给一个变量，或者重复定义一样的函数，那么这就是一个重复的工作，所以这个时候我们可以定义一个全局变量或者函数来优化解决该问题。
vue3可以通过在入口的js文件中直接变量，例如：

import { createApp } from 'vue';
import App from './App.vue';
import router from './router';

const app = createApp(App);
app.config.globalProperties.$blog_api = "http://127.0.0.1:5000/api"
app.use(router);
app.mount('#app');

这样就可以在全局的template中使用这个变量，使用方法就是

{{ $blog_api }}

如果是函数的话，就用箭头函数写法

app.config.globalProperties.$http = () => {}

全局使用方法也是和变量一致的。
那么在实际的开发中，不可能在这个首页的main.js文件中直接这样注册到vue上，通常需要更美观更高可维护性的目的，我们是将这些属性和方法通过注册的方法来写。
例如我们在src中创建一个plugin目录，下创建一个globalProperties.js文件

export default {
    install (app) {
        app.config.globalProperties.$blog_api = "http://127.0.0.1:5000/api"
    }
}

然后在入口的main.js文件中进行使用

import { createApp } from 'vue';
import App from './App.vue';
import router from './router';
import globalProperties from './plugin/globalProperties';

const app = createApp(App);
app.use(globalProperties);
app.use(router);
app.mount('#app');

这样就可以在全局的template上使用{{ $blog_api }}来使用
如果我们需要在script标签中使用这个全局变量，那么需要这么操作

import { getCurrentInstance } from 'vue';

const app = getCurrentInstance();
console.log(app.proxy.$blog_api);

就是在需要的组件中引入getCurrentInstance实例化为app对象，然后使用app对象的proxy来获取挂载的全局变量(属性)或者函数(方法)