title: Internationalization for vue 3 vite with i18n
body: <p>I'm currently trying to internationalize my vue 3 vite project with &quot;@intlify/vite-plugin-vue-i18n&quot;. The problem I am facing here, is that i currently have to import and setup the t variable for every component to use it. <br />
  <strong>example component:</strong></p>
  <pre class="lang-html prettyprint-override"><code>&lt;template&gt;
    t('translation')
  &lt;/template&gt;
  
  &lt;script&gt;
  import { useI18n } from 'vue-i18n'
  export default {
    setup(){
      const {t} = useI18n();
      return {t}
    },
  };
  &lt;/script&gt;
  </code></pre>
  <p>My question is, if its possible, what is the best way to  make the variable &quot;t&quot; global? I cant find any examples/help on this, since they all import it into every compoenent. All help would be apreciated! :)
  For reference, here are the relevant files.</p>
  <pre class="lang-js prettyprint-override"><code>export default defineConfig({
    plugins: [
      vue(),
      vueI18n({
        include: path.resolve(__dirname, './src/locales/**')
      })
    ]
  })
  </code></pre>
  <p><strong>main.ts:</strong></p>
  <pre class="lang-js prettyprint-override"><code>import i18n from './i18n';
  const app = createApp(App);
  app.use(i18n);
  app.mount(&quot;#app&quot;);
  </code></pre>
  <p><strong>i18n.js:</strong></p>
  <pre class="lang-js prettyprint-override"><code>import { createI18n } from 'vue-i18n'
  import messages from '@intlify/vite-plugin-vue-i18n/messages'
  
  export default createI18n({
    legacy: false,
    locale: 'no',
    messages
  })
  </code></pre>