Implement composition API

[rchl]

Is your feature request related to a problem? Please describe.

Add a native composition API for use with Vue 3.

Some more info at https://dev.to/alvarosaburido/how-to-migrate-your-library-from-vue2-to-vue3-1h81

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[philipdanielhayton]

Hola guys, any news on this? Or any work around for the short term?

What's the best way to access methods such as localePath inside the setup method currently?

[rchl]

See https://github.com/nuxt-community/composition-api/issues/425#issuecomment-813102698

[DamianGlowala]

@rchl any ideas on how to get a translated string inside setup() (when using an <i18n> custom block)? Everything comes back as a raw translation path... totally lost on this. Anything I am doing incorrectly in the below example? I am using Nuxt 2 with Composition API.

<i18n>
{
  "en": {
    "exampleString": "Test"
  }
}
</i18n>

...

setup() {
  const { i18n } = useContext();
  
  console.log(i18n.t("exampleString"));
}

Is this related to https://github.com/nuxt-community/i18n-module/pull/1333? May I ask why this PR is still a draft?

UPDATE I made a Nuxt composable by copying the useI18n() function from the https://github.com/nuxt-community/i18n-module/pull/1333. Works perfectly as a workaround ;)

[thisismydesign]

On nuxt 2 bridge:

<script setup lang="ts">

const { $i18n } = useNuxtApp()
$i18n.t('key')

</script>

[MatthD]

@thisismydesign is this suppose to work ?