Discussion :

[d3LTa7]

Hello !

Je cherche à insérer plusieurs fichier JS local dans mon projet SF ! J'ai évidement cherché sur internet comment faire mais je comprend pas (je débute en SF).

J'ai créé un dossier "JS" dans le dossier assets et dans le dossier "JS" il y a le fichier testA.js
J'ai aussi créé un fichier testB.js dans le dossier public


Voici mon block javascripts dans mon base.html.twig

Code :

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

1
2
3
4
5
6
 
        {% block javascripts %}
            {% block importmap %}{{ importmap('app') }}{% endblock %}
            <script src="{{asset('JS/testA.js')}}"></script>
            <script src="../public/testB.js"></script>
        {% endblock %}

Dans la console de mon navigateur, quand j'ouvre ma page qui est dans templates/pages/signalement/show.html.twig

Dans show.html.twig :

Code :

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

1
2
3
4
 
<div id="signalement">
     <p>ceci est un test</p>
</div>

Il ne me trouve pas testB : Échec du chargement pour l’élément <script> dont la source est « http://localhost:8000/public/testB.js ».
Il ne me trouve testA j'ai un autre message d'erreur :

Uncaught ReferenceError: can't access lexical declaration 'signalement' before initialization
<anonymous> http://localhost:8000/assets/JS/testA-pvpnoMf.js:1

Je comprends pas trop comment intégrer d'autre fichier en plus du app.js dans Symfony !

Merci de vos lumières

[mathieu]

Il ne me trouve pas testB : Échec du chargement pour l’élément <script> dont la source est « http://localhost:8000/public/testB.js ».

est ce que cet url est correct ?

si l'application symfony a pour racine le répertoire "public" alors l'url des fichiers js devraient plutot ressembler à http://localhost:8000/testB.js.

[Bisûnûrs]

L'utilisation de la fonction Twig asset() ne va pas chercher les fichiers dans un dossier nommé "asset". Tes fichiers doivent être dans le répertoire public pour que le navigateur puisse y avoir accès.
Tu dois donc déplacer ton fichier testA.js dans le répertoire public.

Si tes deux fichiers sont à la racine de public, ton code devient donc :

Code twig :

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

1
2
<script src="{{ asset('testA.js') }}"></script>
<script src="{{ asset('testB.js') }}"></script>

Tu peux créer un répertoire "js" dans le répertoire public, mettre les fichiers dedans et ton code devient donc :

Code twig :

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

1
2
<script src="{{ asset('js/testA.js') }}"></script>
<script src="{{ asset('js/testB.js') }}"></script>