Vue example not reactive + not detected by devtool

Tumulte commented 2 years ago

Prerequisites

[X] I have written a descriptive issue title
[X] I have searched existing issues to ensure the bug has not already been reported

Fastify version

3

Plugin version

0.03

Node.js version

18

Operating system

macOS

Operating system version (i.e. 20.04, 11.3, 10)

Monterey 12.6

Description

I'm just trying out the vue ts example, everything works fine but vue is not reactive (i.e : the original data is displayed, but if I do a simple count++ it won't update. It is also not detected by vue devtool

I use a basic vue-ts example from the dev branch, the only thing I've changed is updating @vueuse/core to latest

Steps to Reproduce

Just install the basic vue example, try reactivity

Expected Behavior

No response

davidmeirlevy commented 2 years ago

Hi

Can you share a demo repository / stackblitz?

It will be helpful to see a demonstration of what you did.

Thanks!

Tumulte commented 2 years ago

@davidmeirlevy sure https://github.com/Tumulte/fastifydx-test

you can go to /admin to see the most basic example.

davidmeirlevy commented 2 years ago

@Tumulte can you try to use setup function instead of the the options API?

Tumulte commented 2 years ago

@davidmeirlevy I have. I've tweaked using-store.vue to make it a simple "push" in an array... with no effect

davidmeirlevy commented 2 years ago

You need to wrap the array with ref() function, as mentioned at the reactivity model of Vue's composition API.

Tumulte commented 2 years ago

@davidmeirlevy ah sorry... I'm not too fan of the composition api but I've updated test-store to a working component (tested within a pure vue app (in a folder frontOnlyTest))... sadly no reactivity or vue detection whatsoever

galvez commented 2 years ago

Fastify DX alpha is terribly outdated — wait for the public beta featuring Vite 3 support and many other fixes in just 3 days from now 😉

fastify / fastify-dx