# Vue3全域變數(app.config.globalProperties)

## Eslint(踩坑用)
https://zhuanlan.zhihu.com/p/450993469

## config.js

const get =()=> {
  console.log("dsad")
  return "get"
}
const unpackget =()=> {
  return "unpackget"
}
// ts需組建實例聲明
// 此段聲明切勿放在shims-vue.d.ts
declare module '@vue/runtime-core' {
  interface ComponentCustomProperties {
    $aaa: any
  }
}
export default {
  install: (app:any, options:any) => {
    app.config.globalProperties.$aaa = "aaa"
    // const config = app.config.globalProperties
    app.config.globalProperties.$config = {
      get: get(),
      unpackget: unpackget()
    }
    // config.$config.unpackget = unpackget();
  }
}

## Vue檔引用方法

模板可以直接$使用
若要位於composition api內使用需搭配 8 ~ 12行

<script setup lang="ts">
import { getCurrentInstance } from '@vue/runtime-core';
const cns = getCurrentInstance()
console.log(cns?.appContext.config.globalProperties.$aaa)
</script>

<template>
  <a>{{$aaa}}</a>
  <router-view></router-view> 
</template>

## main.js 注入

import App from './App.vue'
import { createApp } from 'vue'
import { createPinia } from 'pinia'
import naive from 'naive-ui'
import router from './router/index'
import aaa from '../public/config'
const app = createApp(App)
//暫時全局引入,依據優化可以改按需引入
app
  .use(aaa)
  .use(naive)
  .use(createPinia())
  .use(router)
// app.use(RouterPush())
app.mount('#app')