Nuxt setup

[xMaxximum]

Hey, nice project!

Would you be open to also writing some docs code to get a minimum version up and running, to test if the library even works as well as some general docs for how to set this up on Nuxt.js? I am also struggling to get the types to work. I get this error: Cannot find module 'vue-data-ui' or its corresponding type declarations.ts(2307 I also noticed that the component does get rendered, but it has no reactivity like the tooltips showing or the options doing anything This is my component file:

<script lang="ts" setup>
import "vue-data-ui/style.css"
import { VueUiXy } from "vue-data-ui";

const config = {
    chart: {
        fontFamily: "inherit"
    }
}

const dataset = [
    {
        name: "Series 1",
        series: [-55, -34, -21, -13, -8, -5, -3, -2, -1, -1, 0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55],
        type: "bar"
        ,
        color: "rgb(95,139,238)",
    },
    {
        name: "Series 2",
        series: [55, 34, 21, 13, 8, 5, 3, 2, 1, 1, 0, -1, -1, -2, -3, -5, -8, -13, -21, -34, -55],
        type:
            "line"
        ,
        color: "rgb(66,211,146)",
        useProgression: true,
        dataLabels: false
    },
    {
        name: "Series 3",
        series: [64, 60, 52, 42, 30, 16, 0, -18, -38, -46, -50, -46, -38, -18, 0, 16, 30, 42, 52, 60, 64],
        type:
            "plot"
        ,
        color: "rgb(255,100,0)"
    },
    {
        name: "Target",
        series: [30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30],
        type: "line",
        color: "#404040",
        dashed: true,
        useTag: "start",
        dataLabels: false,
    },
];

</script>
<template>
    <VueUiXy :config="config" :dataset="dataset" />
</template>

[graphieros]

Hi, thanks for trying out :)

I created a repo with an example implementation for your usecase in Nuxt3. To sum up the steps:

1. Versions prior to v2.1.38: extract the vue-data-ui.d.ts file from the node module and place it at the root of your project so types are available: I released version 1.7.7 with updated types, since I noticed config was mandatory in previous version, however it is optional.
2. create a plugin to import the VueUiXy component
3. import the css
4. Declare your dataset & config as refs or computed

Docs are now updated with a link to this repo. Cheers

[xMaxximum]

Hey, thank you so much for the quick response!

Now I got it to work. This is a great project and I wish you all the best. Turns out the 'nuxt-aos' module also was responsible for not rendering the charts properly...

Anyways, thank you for your work & quick help again! :D