Discussion :

[Amnael]

Bonsoir, j'essaie d'utiliser le module reveal.js.
Je l'ai ajouté à mon node_modules avec npm; vous pouvez également le retrouver sur ce github officiel: https://github.com/hakimel/reveal.js/

Sans parler de Symfony si vous regardez la page index.html de ce module reveal.js, il y a un import:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<script src="js/reveal.js"></script>

C'est à priori le fichier js principal de ce module, et s'il n'est pas présent, l'erreur suivante survient lorsque l'on essaie de faire le Reveal.initialize():

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

Uncaught ReferenceError: Reveal is not defined

Si l'import est présent, tout marche bien.



Problème: coté Symfony, j'ai cette même erreur; mais je ne comprends absolument pas pourquoi, car j'ai bien fait l'import, cf mon webpack.config.js

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
.addEntry('js/app', [
    './assets/js/app.js',
    './node_modules/jquery/dist/jquery.slim.js',
    './node_modules/popper.js/dist/popper.min.js',
    './node_modules/bootstrap/dist/js/bootstrap.min.js',
    './node_modules/holderjs/holder.min.js',
    './node_modules/reveal.js/lib/js/head.min.js',
    './node_modules/reveal.js/js/reveal.js'
])

Pour m'en assurer, je vais voir dans le fichier app.js du build, et je trouve bien la référence à Reveal.js

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
/***/ "./node_modules/reveal.js/js/reveal.js":
/*!*********************************************!*\
!*** ./node_modules/reveal.js/js/reveal.js ***!
\*********************************************/

Je me dis donc que le problème est ailleurs, mais je ne vois pas du tout où cela peut-être
Merci pour votre aide

[Sodium]

Il faut probablement que tu importes Reveal dans le fichier dans lequel tu veux l'utiliser.
https://www.sitepoint.com/understanding-es6-modules/

[Amnael]

C'est aussi ce que je me dis...bien que je trouve cela étrange étant donné que le fichier est concaténé dans le app.js qui lui est bien chargé...


Ceci étant dis, je ne sais pas comment référencer un fichier de node_module à partir d'un fichier js puisque ce dernier n'est pas présent dans les assets.

En scss, j'ai pu aller chercher un fichier de node_modules avec un import ~/reveal.js/css/...

Mais depuis twig jene saurais comment procéder pour charger un script js non présent dans les assets.

[Sodium]

Le but du packetage en modules, c'est aussi de faire en sorte que le code d'un script n'entre pas en conflit avec un autre (même noms de variables et de méthodes par exemple), c'est pourquoi même compilé en un seul fichier il ne sera pas forcément accessible depuis un autre fichier.

Par exemple tu utilises certainement la fonction autoProvidejQuery() dans ta config webpack, celle-ci permettant de faire en sorte que $ fasse référence à jQuery partout, sinon il faut l'importer.

Je n'ai pas beaucoup d'expérience dans l'utilisation de modules ES6 donc je ne peux pas vérifier pour toi, mais je pense que c'est la bonne piste à suivre pour résoudre ton problème

[Amnael]

Je vois, ça parait logique ce que tu me dis là.

Je vais donc creuser cette piste. Merci.

En attendant je suis toujours preneur si quelqun a un exemple d'import similaire.