Considérez le morceau de code html suivant:
<html>
<head>
<script language="JavaScript1.5">
// sdk code
// root_scripts
// component1 code
// component2 code
</script>
</head>
<body>
<h2>simple page</h2>
Hi world
<div id="root"></div>
</body>
</html>
Les lignes code composant1 et code composant2 peuvent être soit juste 2 inclus à différents fichiers js, ou vraiment 2 morceaux de code javascript, je m'en fiche.
J'essaie de comprendre combien 2 morceaux de code peuvent être isolés dans la même page. Par exemple, supposons que code composant1 inclut jquery et que code composant2 inclut react js et que les 2 versions spécifiques que j'ai incluses ont des bibliothèques spécifiques. Cela signifie qu'un composant pourrait casser l'autre et qu'ils ne seraient pas complètement isolés.
En supposant que les deux composants devraient accéder aux éléments dom dans ce html (donc iframe ne serait pas vraiment une option, je suppose), existe-t-il un bon moyen de créer un "environnement" de script java complètement isolé pour chaque morceau de code? Comme 2 portées différentes, avec leurs propres importations et elles ne pouvaient pas entrer en conflit les unes avec les autres, mais pouvant toujours faire partie de la même page html?
3 Réponses :
Je ne connais pas JavaScript, mais vous pouvez le faire avec Angular et Typescript.
Avec Angular 4 et supérieur, vous pouvez avoir des scripts complètement séparés s'exécutant dans différents composants.
Oui, mais je veux que le composant 1 utilise angular et le composant 2 utilise jquery, par exemple. La partie la plus difficile est les dépendances, le composant 1 pourrait utiliser la version angulaire 123 et le composant 2 pourrait utiliser la version angulaire 234
Problème intéressant!
La norme JavaScript de 2015 introduit son propre système de modules différent. Il est généralement appelé modules ES, où ES signifie ECMAScript. Au lieu d'appeler une fonction pour accéder à une dépendance, vous utilisez un mot-clé d'importation spécial.
Pourriez-vous s'il vous plaît élaborer ou fournir un lien que je pourrais étudier davantage?
Merci! Cela ressemble à ce que je veux, je ne suis pas encore sûr! Je vais l'étudier, merci beaucoup
Je dois encore chercher plus sur la façon d'isoler les parties dom et d'ombrer certaines variables globales, mais ce serait une autre question. Vous avez répondu à ce que je cherchais, merci.
Ouais. il existe également un shadow-dom pour isoler HTML et CSS.
Je pense que vous pouvez opter pour un cadre d'application d'une seule page comme angular pour votre solution. En angulaire,
Il vous suffit de créer deux composants différents pour comp1 et comp2 et ils seraient tous deux isolés l'un de l'autre à moins que vous ne les fassiez interagir à l'aide d'un service partagé ou d'interactions parent-enfant.
Modifier: vous pouvez utiliser la fonctionnalité du module de script ECMA pour la même chose.
Voici la référence: https://medium.freecodecamp.org/how-to-use-ecmascript-modules-to-build-modular-components-in-javascript-9023205ea42a
Merci à @behzad
Que voulez-vous dire "complètement isolé"? Il n'y a qu'un seul contexte global, donc si vous avez besoin d'isolement, vous devez définir correctement la portée de votre code et ne pas atteindre le contexte global. De plus, sur une note HTML5,