|
@@ -44,7 +44,7 @@ pnpm add @types/three -D
|
|
|
|
|
|
## Vite
|
|
## Vite
|
|
|
|
|
|
-Si vous utilisez Vite, vous devez ajoutez ceci à votre `vite.config.ts`:
|
|
|
|
|
|
+Si vous utilisez Vite, vous devez ajouter ceci à votre `vite.config.ts`:
|
|
|
|
|
|
```ts [vite.config.ts]
|
|
```ts [vite.config.ts]
|
|
import { templateCompilerOptions } from '@tresjs/core'
|
|
import { templateCompilerOptions } from '@tresjs/core'
|
|
@@ -79,17 +79,17 @@ Nous avons un nouveau starter [StackBlitz](https://stackblitz.com/) afin d'essay
|
|
|
|
|
|
## Labs
|
|
## Labs
|
|
|
|
|
|
-Nous avons aussi un playground où vous pouvez essayer TresJS en ligne. Testez [ici](https://play.tresjs.org/).
|
|
|
|
|
|
+Nous avons un laboratoire de démonstration d'exemples créés avec TresJS. Consultez-le [ici](https://play.tresjs.org/).
|
|
|
|
|
|
-<iframe src="https://play.tresjs.org/" class="w-full rounded shadow-lg outline-none border-none aspect-4/3"></iframe>
|
|
|
|
|
|
+
|
|
|
|
|
|
## Motivation
|
|
## Motivation
|
|
|
|
|
|
[ThreeJS](https://threejs.org/) est une merveilleuse bibliothèque pour faire de superbes sites en 3D avec WebGL. C'est aussi une bibliothèque en perpétuelle évolution, ce qui rend complèxe le maintien de wrapper comme [TroisJS](https://troisjs.github.io/) afin de le garder constamment à jour.
|
|
[ThreeJS](https://threejs.org/) est une merveilleuse bibliothèque pour faire de superbes sites en 3D avec WebGL. C'est aussi une bibliothèque en perpétuelle évolution, ce qui rend complèxe le maintien de wrapper comme [TroisJS](https://troisjs.github.io/) afin de le garder constamment à jour.
|
|
|
|
|
|
-L'écosytème React possède un impréssionnant **moteur de rendu personnalisé** appellé [React-three-fiber](https://docs.pmnd.rs/react-three-fiber) qui permet de créer des scènes 3D, de manière déclarative, avec des composants réutilisables et autonomes qui réagissent aux états.
|
|
|
|
|
|
+L'écosystème React possède un impréssionnant **moteur de rendu personnalisé** appellé [React-three-fiber](https://docs.pmnd.rs/react-three-fiber) qui permet de créer des scènes 3D, de manière déclarative, avec des composants réutilisables et autonomes qui réagissent aux états.
|
|
|
|
|
|
-Dans ma recherche d'un outil similaire dans l'écosytème VueJS j'ai trouvé cette incroyable bibliothèque nommée [Lunchbox](https://github.com/breakfast-studio/lunchboxjs) qui fonctionne de la même manière que R3F, il propose un [moteur de rendu personnalisé Vue3](https://vuejs.org/api/custom-renderer.html). Je contribue aussi à améliorer cette bibliothèque afin qu'elle devienne aussi mature et complète que R3F.
|
|
|
|
|
|
+Dans ma recherche d'un outil similaire dans l'écosystème VueJS j'ai trouvé cette incroyable bibliothèque nommée [Lunchbox](https://github.com/breakfast-studio/lunchboxjs) qui fonctionne de la même manière que R3F, il propose un [moteur de rendu personnalisé Vue3](https://vuejs.org/api/custom-renderer.html). Je contribue aussi à améliorer cette bibliothèque afin qu'elle devienne aussi mature et complète que R3F.
|
|
|
|
|
|
Le seul problème concerne le mélange des compilateurs et des moteurs de rendu en Vue3. C'est un sujet sur lequel la communauté Vue travaille encore. Pour plus d'informations voir [ici](https://github.com/vuejs/vue-loader/pull/1645).
|
|
Le seul problème concerne le mélange des compilateurs et des moteurs de rendu en Vue3. C'est un sujet sur lequel la communauté Vue travaille encore. Pour plus d'informations voir [ici](https://github.com/vuejs/vue-loader/pull/1645).
|
|
|
|
|
|
@@ -110,4 +110,4 @@ const lunchboxApp = createLunchboxApp(LunchboxApp)
|
|
lunchboxApp.mount('#lunchbox')
|
|
lunchboxApp.mount('#lunchbox')
|
|
```
|
|
```
|
|
|
|
|
|
-Ces deux bibliothèques m'ont donc inspiré pour créer un moteur de rendu personnalisé Vue pour ThreeJS. Il s'appel **TresJS v2**.
|
|
|
|
|
|
+Ces deux bibliothèques m'ont donc inspiré pour créer un moteur de rendu personnalisé Vue pour ThreeJS. Il s'appelle **TresJS v2**.
|