Résoudre l'erreur Expected an assignment or function call and instead saw an expression no-unused-expressions ?
Le framework ReactJS, bien qu'écrit en JavaScript, utilise une écriture différente du JavaScript standard. Avec son système de composants, la syntaxe d'une application écrite en React est propre au framework. Pour un novice, il faut bien faire attention à la documentation de React et à la façon dont les instructions de code sont écrites. Le message d'erreur "Expected an assignment or function call and instead saw an expression no-unused-expressions" est lié à un problème de syntaxe.
Cette erreur indique qu'au lieu de retourner une fonction ou une valeur, la fonction a retourné une expression non définie. Cette erreur est causée par un retour à la ligne situé entre le mot-clé "return" et la parenthèse contenant votre code.
// Exemple provoquant ce message d'erreur
return
(
<div>Voici mon composant</div>
)
Si vous mettez un retour à la ligne entre le mot-clé et la parenthèse, sans qu'il y ait de point-virgule pour terminer l'instruction de code, le navigateur va interpréter directement la première ligne avec le "return" seul. Il considèrera que vous avez renvoyé le mot-clé "undefined", qui correspond à une expression non définie, ce qui provoque le message d'erreur. La parenthèse ouvrante doit donc être sur la même ligne que le mot-clé "return".
// Exemple qui fonctionne
return (
<div>Voici mon composant</div>
)
Une autre erreur peut être la confusion entre des parenthèses et des accolades. Si vous écrivez une fonction précédée d'une flèche, alors vous devez systématiquement retourner une valeur. Avec l'expression écrite entre parenthèses, elle sera systématiquement retournée. Si vous utilisez des accolades, le retour n'est pas systématique. Vous devez ajouter le mot-clé "return" pour que cela fonctionne.
// Fonction avec des accolades si on indique le mot-clé "return"
return {
return <div>Voici mon composant</div>
}