the package is not wroking with vue2 / nuxt js.

[singh3069]

Hey @shuding I have a question that the package has been converted to be an ESM only package. ?

Because while I'm trying to add this package in my project its working for just few minutes and after that is it showing me the error which you can see in the SS. I'm using nuxt js and vue 2.

I Tried to down grade the node-fetch package to verison 2 but it didn't helped me.

Please have a look and let me know

Thank you.

[sameerchoubey]

I was able to use it by directly importing it on mounted.

[singh3069]

hey thank you for your reply can have a some code so that I can see it.

[singh3069]

did you used vue-2 or vue-3 ?

[singh3069]

and I had it working but there is somether prob with me right know regarding the globe.

[sameerchoubey]

async mounted(){ let phi = 0 let canvas = document.getElementById("cobe") let width = 500 import('cobe').then( obj => { obj.default(canvas, { devicePixelRatio: 2, width: width * 2, height: width * 2, phi: 6.3, theta: 0.51, dark: 1, diffuse: 0.6, scale: 1.08, mapSamples: 16000, mapBrightness: 2.4, baseColor: [0.2352, 0.2352, 0.2352], markerColor: [0.2784, 0.4941, 1], glowColor: [0.1333, 0.1333, 0.1333], offset: [0, width * 2 * 0.6], markers: this.locations, onRender: (state) => { state.width = width * 2 state.height = width * 2 // console.log('state', state) // Called on every animation frame. // state` will be an empty object, return updated params.
// state.phi = phi
// phi += 0.01
},
})
}).catch(err=>console.log('errr',err))

    // import('cobe').then (obj => {
    //     obj.toggle()
    // }) 
},`


This is how my mounted is looking like.
`<div class="mt-5">
        <canvas
            ref="cobb"
            id="cobe"
            class="mx-auto"
            width="500"
            height="500"
        >
        </canvas>
    </div>`

[singh3069]

is there any place I can message you personally?