Int�grer une application Angular dans un site WordPress

Version imprimable

03/06/2021, 09h23
killianweid

Int�grer une application Angular dans un site WordPress

Bonjour,
J'essaie d'int�grer une application Angular (v12) dans mon site WordPress.
Je trouve des solutions sur le web mais aucune ne fonctionne pour moi. J'ai essay� celles-ci :
https://laternastudio.com/blog/inclu...-any-php-page/
https://stackoverflow.com/a/55900163/11382925

Lorsque je mets <app-root></app-root> dans une page de contenu wp (par exemple: header.php), rien n'appara�t sur la page bien que les fichiers de script Angular (scripts.js, main.js, polyfills.js et runtime.js) sont charg�s dans la page. Sachant que j'ai concat�n� les fichiers main-es5.js, runtime-es5.js et polyfills-es5.js en un seul fichier. De m�me pour les fichiers li�s � es2015. Je ne pense pas que ce soit un probl�me.

Toute aide est la bienvenue ! Merci d'avance :)
03/06/2021, 09h35
krakatoa

le 1er lien ne fonctionne pas.
met nous au moins le code de l'index

sinon pour tester, sans concatener les fichiers �a donne quoi ?
03/06/2021, 13h37
killianweid

J'ai corrig�, le 1er lien devrait maintenant fonctionner.
En effet, j'avais pas test� sans la concatenation et cela fonctionne.
Maintenant je ne sais pas o� placer la balise <app-root> sans que cela p�te le contenu du site wordpress (si je met <app-root> juste apr�s <body> et </app-root> juste avant </body> le contenu du site n'est pas affich�).
Tu as une id�e de l'endroit o� je devrai la mettre ?

normalement c'est comme �a :

Code:

1
2
3
4
5
6
7
8
9
10
<!DOCTYPE html><html lang="en"><head>
  <meta charset="utf-8">
  <title>title</title>
  <base href="/">
...
...
<body class="mat-typography">
  <app-root></app-root>
  <script src="runtime.286e8457a375916e0cc4.js" defer></script><script src="polyfills.3ec20982b34ece53693f.js" defer></script><script src="main.089aabc8f2ce16553eaf.js" defer></script>
</body></html>

tu veux dire que le css cot� wordpress est bordelique ?

03/06/2021, 14h17
killianweid

Si je fais de cette mani�re je ne peux pas inclure de composant angular sur une page sp�cifique. Il faudrait que la balise <app-root> englobe tout le contenu du body sans pour autant casser la logique WordPress (template de page), c'est ce que je voulais dire quand je parlais que le site p�te.
03/06/2021, 14h22
krakatoa

regarde du cot� d'angular element.
https://iner-dukoid.developpez.com/t...ngular/#LXXVII
https://www.techiediaries.com/angula...eb-components/

le composant que tu va rendre compatible navigateur est donc le composant : app.component