Skip to content

Feature request: Nuxt support #695

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
4 of 5 tasks
Demivan opened this issue Sep 13, 2021 · 12 comments
Closed
4 of 5 tasks

Feature request: Nuxt support #695

Demivan opened this issue Sep 13, 2021 · 12 comments
Assignees

Comments

@Demivan
Copy link
Member

Demivan commented Sep 13, 2021

Nuxt 2:

Nuxt 3:

  • Build module

Common?:

  • Create a package for directive SSR support
  • Reimplement @nuxtjs/i18n for fluent-vue. Probably when @nuxt/i18n is updated to Nuxt 3 Scope is too big
@Demivan Demivan self-assigned this Sep 13, 2021
@reemhamz
Copy link

Hey there @Demivan! Wondering if support for Nuxt is underway. I'm trying to introduce Nuxt for one of our projects here and having Fluent support would be grande.

@Demivan
Copy link
Member Author

Demivan commented Oct 13, 2021

I will be starting on it tomorrow. I was busy with my main job, so didn't have time to work on it before.
@reemhamz Are you planning to use Nuxt 2 or 3?

@reemhamz
Copy link

@Demivan no worries! Thanks for taking the time to work on this. Currently just Nuxt2 since Nuxt3 is still in Beta, but once that version is stable and up to par, I'd be happy to migrate to Nuxt3, but that's a later problem.

@Demivan
Copy link
Member Author

Demivan commented Oct 16, 2021

I have added a simple Nuxt 2 example: https://github.com/fluent-vue/examples/tree/main/nuxt-2

Implementing something like https://github.com/nuxt-community/i18n-module will take much more time. I'd rather work on making v-t directive compatible with SSR for now. When Nuxt 3 is stable I should be able to use nuxt-kit to implement analog of i18n-module that is Nuxt 2 and Nuxt 3 compatible.

@Demivan
Copy link
Member Author

Demivan commented Oct 16, 2021

SSR support wasn't that bad. :) I have merged it to that example.

I will extract Nuxt build module to a separate package later.

@0xMANFRE
Copy link

0xMANFRE commented Mar 4, 2024

Reimplement @nuxtjs/i18n for fluent-vue. Probably when @nuxt/i18n is updated to Nuxt 3

@Demivan is the Nuxt 3 module still worked on?
The pluralisation syntax of vue-i18n and @nuxtjs/i18n is terrible and has zero flexibility compared to Fluent or even MessageFormat.
I would love to switch to a future @nuxtjs/fluent or @fluent-vue/nuxt when it will become available.

@Demivan
Copy link
Member Author

Demivan commented Mar 4, 2024

@0xMANFRE @nuxtjs/i18n is huge and has lots of features. It will be few times bigger than fluent-vue itself. I don't have time to reimplement everything.
But basic integration of fluent-vue into Nuxt is easy. You add unplugin-fluent-vue Vite plugin and create a custom Nuxt plugin that initializes fluent-vue. Code is SSR compatible already.

@Demivan
Copy link
Member Author

Demivan commented Mar 4, 2024

By the way, I plan to support MessageFormat 4 when the syntax is finalized.

@0xMANFRE
Copy link

0xMANFRE commented Mar 4, 2024

But basic integration of fluent-vue into Nuxt is easy. You add unplugin-fluent-vue Vite plugin and create a custom Nuxt plugin that initializes fluent-vue. Code is SSR compatible already.

The documentation provides only a Vite config file.
Is there a working Vue 3 example that has external locale files and a locale switcher? I can't seem to find it.

@Demivan
Copy link
Member Author

Demivan commented Mar 4, 2024

There is no Nuxt 3 example. I will create it and link it here.

@Demivan
Copy link
Member Author

Demivan commented Mar 4, 2024

Added Nuxt 3 example https://github.com/fluent-vue/examples/tree/main/nuxt-3. Check the plugins and modules folders for implementation. You still need some way of selecting the current locale on the server, but that really depends on your site (is it per domain, path or read from cookie)

What is not working is SSR for the v-t directive. I almost never use it, but I will work on the SSR implementation this week.

@Demivan
Copy link
Member Author

Demivan commented Apr 5, 2024

Nuxt 3 integration is done. Docs can be found here: https://fluent-vue.demivan.me/integrations/nuxt

@Demivan Demivan closed this as completed Apr 5, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

No branches or pull requests

3 participants