Comment réparer « Uncaught Referenceerror: require is not defined » en JavaScript

Dans cet article, vous apprendrez comment réparer « l’erreur de référence non interceptée : l’exigence n’est pas définie » en JavaScript qui se produit lorsque la variable requise n’est pas spécifiée.

La programmation en HTML et CSS est une entreprise intéressante, mais devoir écrire en JavaScript peut sembler un peu facile au début, c’est-à-dire jusqu’à ce qu’une erreur apparaisse de nulle part et que vous n’ayez aucune idée de ce que devrait être la prochaine étape.

Le problème Javascript « require is not defined » est l’une des erreurs les plus courantes que nous rencontrons en tant que programmeurs, et il existe une variété de facteurs qui peuvent provoquer cette erreur.

Ceci est le plus souvent le résultat d’un JavaScript incapable de gérer correctement une référence à la fonction require(). Cette fonctionnalité n’est disponible que dans les environnements node.js par défaut.

Ce problème peut également être causé par les éléments suivants :

• L’utilisation de la fonction require() dans un navigateur
• Utilisation de la fonction require () dans un projet Node.js avec le ‘type’ du fichier package.json défini sur ‘module’
• Implémentation de la méthode require() dans Nod.js pour les fichiers avec une extension ‘.mjs’.
• Implémentation de la méthode require() dans Nod.js pour les fichiers avec une extension ‘.mjs’.
• Si votre question est, « Comment pouvons-nous corriger cette erreur? » Alors ne vous inquiétez pas, nous avons ça ! Dans le navigateur et le serveur, cette erreur peut se produire. Et nous avons des réponses pour vos deux situations. Par conséquent, commençons tout de suite!

Correction de Javascript « require is not defined » dans un navigateur

Il n’est pas possible d’utiliser la fonction require() dans un navigateur car elle n’est prise en charge que par le nœud. La syntaxe d’exportation et d’importation à partir de la structure du module ES6 sera utilisée pour résoudre ce problème. Seuls les navigateurs peuvent utiliser cette méthode, et elle sert d’alternative à la méthode require().

Le code HTML pour la syntaxe d’importation/exportation ES6 est illustré ci-dessous :

Cette syntaxe peut être utilisée dans vos fichiers.js une fois importés. L’exportation d’une fonction JavaScript et d’une variable est l’étape suivante.

Importez un autre fichier.js maintenant pour utiliser la syntaxe de ce fichier :

Vous êtes maintenant prêt à partir ! Au lieu d’appeler la méthode require(), vous devez utiliser cette syntaxe dans le navigateur.

Correction de « require is not defined » sur un serveur

Il est possible que la fonction require() ne soit pas définie sur votre serveur, ce qui expliquerait ce problème. Ce problème peut être résolu en renommant tous les fichiers avec une extension « .mjs » en « .js » et en supprimant la valeur « type » si elle est définie sur « module » dans votre fichier « package.json ».

Le code.json est le suivant :

Si vous préférez la syntaxe du module ES6, vous pouvez également utiliser les mots-clés import et export. Pour transférer des modules, tout ce que vous avez à faire est d’utiliser les mots-clés d’importation et d’exportation.

Voici un exemple

Le bloc de code que vous avez exporté peut maintenant être importé dans un autre fichier et utilisé comme bon vous semble.

Voici un exemple :

Conclusion

Vous ne devriez plus avoir de problèmes. Vous devez simplement identifier où le problème se produit, puis le coder de manière appropriée. Vous ne devez absolument pas combiner l’utilisation de la méthode require() et du module ES6 de quelque manière que ce soit. C’est un point essentiel que vous devez avoir à l’esprit en tout temps. Vous n’êtes pas autorisé à en utiliser plus d’un à la fois !

Si vous cherchez une solution descriptive à cette erreur et à d’autres erreurs comme celle-ci, vous pouvez visiter Tutoriel informatique. Chaque article d’ITtutoria renforce les compétences et la confiance du lecteur dans la résolution des erreurs du site Web.