Official tsParticles VueJS 3.x component Installation yarn add @tsparticles/vue3 Usage import Particles from "@tsparticles/vue3"; //import { loadFull } from "tsparticles"; // if you are going to use `loadFull`,
1. 要安装两个包 npm install particles.vue3npm install tsparticles 2. 可选择全局引入main.js //导入粒子库import Particles from "particles.vue3";//use 注册createApp(App) .use(Particles) .mount("#app"); 3. 在使用粒子库的页面,例如Login.vue <template> <vue-particles id="tsparticles":partic...
首先,需要安装particles.vue3和tsparticles(或tsparticles-slim)这两个包。particles.vue3是一个Vue组件,用于在Vue项目中集成粒子效果,而tsparticles是粒子效果的底层库。 bash npm install particles.vue3 tsparticles 或者 bash pnpm add particles.vue3 tsparticles-slim 2. 在Vue项目中注册粒子组件 在main.js(或...
--引入粒子特效--><Particlesid="tsparticles":options="options"/> 非ts写法 //<!--引入粒子特效的相关配置-->constoptions={background:{color:{value:"#dedede",//粒子颜色}, },fpsLimit:60,interactivity:{events:{onClick:{enable:true,mode:"push",//可用的click模式有:"push","remove","repulse"...
Official tsParticles Vue.js 3.x Component - Easily create highly customizable particle, confetti and fireworks animations and use them as animated backgrounds for your website. Ready to use components available also for Web Components, React, Vue.js 2.x,
GitHub地址 https://github.com/tsparticles/vue3 配置参数说明: color: String类型 默认’#dedede’。粒子颜色。 particleOpacity: Number类型 默认0.7。粒子透明度。 particlesNumber: Number类型 默认80。粒子数量。 shapeType: String类型 默认’circle’, 可用的粒子外观类型有:“circle”,“edge”,“triangle”, ...
pnpm add tsparticles-slim 1. 2. 注册 main.js import { createApp } from 'vue' import type { App } from 'vue' import globleApp from './App.vue' import router from './router' import Particles from "particles.vue3" const app: App = createApp(globleApp) ...
Vue.js tsParticles official component. Contribute to tsparticles/vue3 development by creating an account on GitHub.
"tsparticles": "^2.9.3", "vue": "^3.4.21", "vue-router": "^4.3.0" }, "devDependencies": { "@vitejs/plugin-vue": "^5.0.4", "vite": "^5.1.6" } }, "node_modules/@babel/parser": { "version": "7.24.1", "resolved": "https://registry.npmmirror.com/@...
二、VUE3+TS 项目中使用 1、src目录下创建文件名为 env.d.ts,声明文件 declaremodule'particles.vue3'; 2、main.ts 中导入 importParticlesfrom'particles.vue3'createApp(App) .use(Particles) .mount('#app') 3、页面中使用 <template><Particlesid="tsparticles":particlesInit="particlesInit":particles...