tsparticles / vue3

Vue.js tsParticles official component
MIT License
109 stars 6 forks source link

The Particles component executes a use() exception #9

Closed seechangan closed 1 year ago

seechangan commented 1 year ago
// Component code login.vue
<script setup lang='ts'>
import type { Engine } from "tsparticles-engine";
import { loadFull } from "tsparticles";
import { basic,backgroundMask } from "tsparticles-demo-configs";
const options = backgroundMask
const particlesInit = async (engine: Engine) => {
await loadFull(engine);
};

</script>
<template>
<div class="login"></div>
<Particles id="tsparticles" :options="options" :particlesInit="particlesInit" />
</template>
// main.ts file code
import { createApp } from 'vue'
import { createPinia } from 'pinia'
import App from './App.vue'
import router from './router'
import Particles from "vue3-particles";

const app = createApp(App).use(Particles);
app.use(createPinia())
app.use(router)
app.mount('#app')

Dependent version:

"tsparticles": "2.9.3",
"tsparticles-demo-configs": "^2.9.3",
"tsparticles-engine": "^2.9.3",
"vue3-particles": "^2.9.3",
"vue": "^3.2.47",
"vite": "^4.1.4",

Problem description: In execution.use(Particles); A red down wave error occurs after this step. Hover displays the following error message:

(alias) const Particles: (app: App, options: unknown) => void
import Particles
Arguments of type "(app: App, options: unknown) => void" cannot be assigned to arguments of type "Plugin_2<[]>".
Cannot assign type "(app: App, options: unknown) => void" to type "((app: App) => any) & {install?   : ((app: App) => any) | undefined;   } ".
Cannot assign type "(app: App, options: unknown) => void" to type "(app: App) => any".
matteobruni commented 1 year ago

They changed something in the TypeScript types (ref issue: https://github.com/vuejs/core/issues/7655)

I tried updating all vue dependencies in this repository to the latest and the error is gone. I can't release it now, to solve the build issue try to downgrade vue to 3.2.45 which was the version used by the component.