Skip to content

Commit d3e75df

Browse files
matteobrunimatteobruni
committed
feat: working for making it work and updating for v3, still not ready
1 parent 8bb427c commit d3e75df

File tree

11 files changed

+3427
-1190
lines changed

11 files changed

+3427
-1190
lines changed

‎apps/vue2/package.json‎

Lines changed: 21 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -21,41 +21,41 @@
2121
"url": "https://github.com/tsparticles/vue2/issues"
2222
},
2323
"dependencies": {
24-
"@tsparticles/configs": "^3.0.0-beta.2",
25-
"@tsparticles/engine": "^3.0.0-beta.2",
24+
"@tsparticles/configs": "^3.0.2",
25+
"@tsparticles/engine": "^3.0.2",
2626
"@tsparticles/vue": "workspace:^",
27-
"tsparticles": "^3.0.0-beta.2",
28-
"vue": "^2.7.14",
27+
"tsparticles": "^3.0.2",
28+
"vue": "^2.7.15",
2929
"vue-class-component": "^7.2.6",
3030
"vue-property-decorator": "^9.1.2"
3131
},
3232
"devDependencies": {
33-
"@babel/core": "^7.22.19",
33+
"@babel/core": "^7.23.5",
3434
"@babel/plugin-proposal-class-properties": "^7.18.6",
35-
"@babel/plugin-proposal-decorators": "^7.22.15",
36-
"@rollup/plugin-json": "^6.0.0",
37-
"@rollup/plugin-node-resolve": "^15.2.1",
38-
"@rollup/plugin-replace": "^5.0.2",
39-
"@typescript-eslint/eslint-plugin": "^6.7.0",
40-
"@typescript-eslint/parser": "^6.7.0",
35+
"@babel/plugin-proposal-decorators": "^7.23.5",
36+
"@rollup/plugin-json": "^6.0.1",
37+
"@rollup/plugin-node-resolve": "^15.2.3",
38+
"@rollup/plugin-replace": "^5.0.5",
39+
"@typescript-eslint/eslint-plugin": "^6.13.2",
40+
"@typescript-eslint/parser": "^6.13.2",
4141
"@vue/cli-plugin-babel": "^5.0.8",
4242
"@vue/cli-plugin-typescript": "^5.0.8",
4343
"@vue/cli-service": "^5.0.8",
44-
"babel-loader": "^8.3.0",
45-
"eslint": "^8.49.0",
46-
"eslint-config-prettier": "^9.0.0",
47-
"fork-ts-checker-webpack-plugin": "^8.0.0",
48-
"postcss": "^8.4.29",
49-
"prettier": "^3.0.3",
50-
"rollup": "^2.79.1",
44+
"babel-loader": "^9.1.3",
45+
"eslint": "^8.55.0",
46+
"eslint-config-prettier": "^9.1.0",
47+
"fork-ts-checker-webpack-plugin": "^9.0.2",
48+
"postcss": "^8.4.32",
49+
"prettier": "^3.1.0",
50+
"rollup": "^4.7.0",
5151
"rollup-plugin-terser": "^7.0.2",
5252
"rollup-plugin-typescript": "^1.0.1",
53-
"rollup-plugin-typescript2": "^0.35.0",
53+
"rollup-plugin-typescript2": "^0.36.0",
5454
"rollup-plugin-vue": "^5.1.9",
5555
"tslib": "^2.6.2",
56-
"typescript": "^5.2.2",
56+
"typescript": "^5.3.3",
5757
"vue-loader": "^15.10.2",
58-
"vue-template-compiler": "^2.7.14",
58+
"vue-template-compiler": "^2.7.15",
5959
"webpack": "^4.46.0"
6060
}
6161
}

‎apps/vue2/src/App.vue‎

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,16 @@
11
<template>
22
<div id="app">
33
<img alt="Vue logo" src="./assets/logo.png"/>
4-
<vue-particles id="tsparticles" :options="options" :particlesInit="particlesInit"/>
4+
<vue-particles id="tsparticles" :options="options"/>
55
</div>
66
</template>
77

88
<script lang="ts">
99
import { Vue } from "vue-property-decorator";
1010
import configs from "@tsparticles/configs";
11-
import type { Engine } from "@tsparticles/engine";
12-
import { loadFull } from "tsparticles";
1311
1412
export default class App extends Vue {
1513
options = configs.basic;
16-
17-
async particlesInit(engine: Engine) {
18-
await loadFull(engine);
19-
}
2014
}
2115
</script>
2216

‎apps/vue2/src/main.ts‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,20 @@
11
import Vue from 'vue'
22
import App from './App.vue'
33
import Particles from "@tsparticles/vue";
4+
import { loadFull } from "tsparticles";
5+
import type { Engine } from '@tsparticles/engine';
46

57
Vue.config.productionTip = false
68

79

8-
Vue.use(Particles);
10+
Vue.use(Particles, {
11+
init: async (engine: Engine) => {
12+
// you can initialize the tsParticles instance (main)
13+
// here, adding custom shapes or presets
14+
await loadFull(engine);
15+
}
16+
});
917

1018
new Vue({
11-
render: h => h(App),
19+
render: h => h(App),
1220
}).$mount('#app')

‎apps/vue2/src/shims-vue.d.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,4 @@ declare module '*.vue' {
33
export default Vue
44
}
55

6-
declare module "@tsparticles/vue";
6+
declare module "@tsparticles/vue";

‎apps/vue3/package.json‎

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -12,29 +12,29 @@
1212
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore"
1313
},
1414
"dependencies": {
15-
"@tsparticles/configs": "^3.0.0-beta.2",
16-
"@tsparticles/engine": "^3.0.0-beta.2",
15+
"@tsparticles/configs": "^3.0.2",
16+
"@tsparticles/engine": "^3.0.2",
1717
"@tsparticles/vue": "workspace:^",
18-
"tsparticles": "^3.0.0-beta.2",
19-
"vue": "^3.3.4",
20-
"vue-router": "^4.2.4"
18+
"tsparticles": "^3.0.2",
19+
"vue": "^3.3.11",
20+
"vue-router": "^4.2.5"
2121
},
2222
"devDependencies": {
23-
"@rushstack/eslint-patch": "^1.3.2",
24-
"@tsconfig/node18": "^18.2.0",
25-
"@types/node": "^20.4.7",
26-
"@vitejs/plugin-vue": "^4.2.3",
27-
"@vitejs/plugin-vue-jsx": "^3.0.1",
23+
"@rushstack/eslint-patch": "^1.6.0",
24+
"@tsconfig/node18": "^18.2.2",
25+
"@types/node": "^20.10.4",
26+
"@vitejs/plugin-vue": "^4.5.2",
27+
"@vitejs/plugin-vue-jsx": "^3.1.0",
2828
"@vue/eslint-config-prettier": "^8.0.0",
2929
"@vue/eslint-config-typescript": "^12.0.0",
3030
"@vue/tsconfig": "^0.4.0",
31-
"eslint": "^8.46.0",
32-
"eslint-plugin-vue": "^9.16.1",
31+
"eslint": "^8.55.0",
32+
"eslint-plugin-vue": "^9.19.2",
3333
"minimatch": "^9.0.3",
3434
"npm-run-all": "^4.1.5",
35-
"prettier": "^3.0.1",
36-
"typescript": "^5.1.6",
37-
"vite": "^4.4.8",
38-
"vue-tsc": "^1.8.8"
35+
"prettier": "^3.1.0",
36+
"typescript": "^5.3.3",
37+
"vite": "^5.0.7",
38+
"vue-tsc": "^1.8.25"
3939
}
4040
}

‎apps/vue3/src/App.vue‎

Lines changed: 4 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,9 @@
11
<script setup lang="ts">
22
import configs from "@tsparticles/configs";
3-
import type { Container, Engine } from "@tsparticles/engine";
4-
import { loadFull } from "tsparticles";
3+
import type { Container } from "@tsparticles/engine";
54
65
const options = configs.basic;
76
8-
const particlesInit = async (engine: Engine) => {
9-
await loadFull(engine);
10-
};
11-
127
const particlesLoaded = async (container: Container) => {
138
console.log(container);
149
};
@@ -17,10 +12,9 @@ const particlesLoaded = async (container: Container) => {
1712
<template>
1813
<main>
1914
<vue-particles
20-
id="tsparticles"
21-
:options="options"
22-
:particles-init="particlesInit"
23-
@particles-loaded="particlesLoaded"
15+
id="tsparticles"
16+
:options="options"
17+
@particles-loaded="particlesLoaded"
2418
/>
2519
</main>
2620
</template>

‎apps/vue3/src/main.ts‎

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,23 @@ import Particles from "@tsparticles/vue";
33
import App from "./App.vue";
44

55
import "./assets/main.css";
6+
import { loadFull } from "tsparticles";
7+
import type { Engine } from "@tsparticles/engine";
68

79
const app = createApp(App);
810

9-
app.use(Particles);
11+
app.use(Particles, {
12+
init: async (engine: Engine) => {
13+
// you can initialize the tsParticles instance (main)
14+
// here, adding custom shapes or presets
15+
await loadFull(engine);
16+
}
17+
}); /*.use(Particles, {
18+
init: async (engine: Engine) => {
19+
// you can initialize the tsParticles instance (main)
20+
// here, adding custom shapes or presets
21+
await loadFull(engine);
22+
}
23+
});*/
1024

1125
app.mount("#app");

‎components/vue/package.json‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -92,29 +92,29 @@
9292
],
9393
"prettier": "@tsparticles/prettier-config",
9494
"dependencies": {
95-
"@tsparticles/engine": "^3.0.0-beta.2",
95+
"@tsparticles/engine": "^3.0.2",
9696
"vue-demi": "^0.14.6"
9797
},
9898
"devDependencies": {
99-
"@rushstack/eslint-patch": "^1.4.0",
99+
"@rushstack/eslint-patch": "^1.6.0",
100100
"@tsconfig/node18": "^18.2.2",
101-
"@tsparticles/prettier-config": "^1.12.0",
102-
"@types/node": "^20.6.0",
103-
"@vitejs/plugin-vue": "^4.3.4",
104-
"@vitejs/plugin-vue-jsx": "^3.0.2",
101+
"@tsparticles/prettier-config": "^2.0.0",
102+
"@types/node": "^20.10.4",
103+
"@vitejs/plugin-vue": "^4.5.2",
104+
"@vitejs/plugin-vue-jsx": "^3.1.0",
105105
"@vue/eslint-config-prettier": "^8.0.0",
106106
"@vue/eslint-config-typescript": "^12.0.0",
107107
"@vue/tsconfig": "^0.4.0",
108-
"eslint": "^8.49.0",
109-
"eslint-plugin-vue": "^9.17.0",
110-
"prettier": "^3.0.3",
111-
"typescript": "^5.2.2",
108+
"eslint": "^8.55.0",
109+
"eslint-plugin-vue": "^9.19.2",
110+
"prettier": "^3.1.0",
111+
"typescript": "^5.3.3",
112112
"unbuild": "^2.0.0",
113-
"vue-tsc": "^1.8.11"
113+
"vue-tsc": "^1.8.25"
114114
},
115115
"peerDependencies": {
116116
"@vue/composition-api": "^1.7.2",
117-
"vue": "^2.7.0 || >=3.3.0"
117+
"vue": "^2.0.0 || >=3.0.0"
118118
},
119119
"peerDependenciesMeta": {
120120
"@vue/composition-api": {

‎components/vue/src/components/Particles.vue‎ renamed to ‎components/vue/src/components/vue-particles.vue‎

File renamed without changes.

‎components/vue/src/index.ts‎

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,16 @@
11
import type { App } from "vue-demi";
2-
import Particles from "./components/Particles.vue";
2+
import Particles from "./components/vue-particles.vue";
3+
import { type Engine, tsParticles } from "@tsparticles/engine";
34

45
export const ParticlesPlugin = {
5-
install(app: App): void {
6-
app.component("Particles", Particles);
7-
app.component("vue-particles", Particles);
6+
install(app: App, options: { init?: (engine: Engine) => Promise<void> }): void {
7+
(async () => {
8+
if (options.init) {
9+
await options.init(tsParticles);
10+
}
11+
})().then(() => {
12+
app.component("vue-particles", Particles);
13+
});
814
},
915
};
1016

0 commit comments

Comments
 (0)