Javascript MDN error Brackets

MDN Learn
#1

Code JavaScript du tutoriel Basic donne erreur avec Brackets.
Le code posant problème est
let myHeading = document.querySelector(‘h1’). Brackets renvoie error :

Expected an identifier and instead saw ‘let’. let myHeading = document.querySelector(‘h1’);

1

Stopping. (50% scanned). let myHeading = document.querySelector(‘h1’);

ESLint (1)

1

X ERROR: Parsing error: Unexpected token myHeading let myHeading = document.querySelector(‘h1’);

#2

Hrm.

The code looks correct, except that it contains smart quotes, which might break things. Try this exact line instead:

let myHeading = document.querySelector('h1');

Also pining @sphinx_knight in case we need some French language support.

#3

Bonjour @applearn,

Nous pouvons échanger en français si vous préférez. Je suppose que vous faites référence à https://wiki.developer.mozilla.org/fr/docs/Apprendre/Commencer_avec_le_web/Les_bases_JavaScript#Un_exemple_«_hello_world_»

Comme le disait @chrisdavidmills, attention dans le message sur Discourse, on peut voir let myHeading = document.querySelector(‘h1’).

Pouvez-vous tester avec la ligne fournie par Chris et nous dire si ça fonctionne mieux ?

#4

Merci pour votre message. La ligne proposée par Chris ne
fonctionne pas mieux. Je fais effectivement référence au document
MDN : "qu’est le JavaScript réellement ?

ps: peut-on utiliser " comme guillemets ?

#5

Bonjour @applearn,

Je commence par la fin : oui on peut utiliser " comme séparateur de chaîne (tant qu’on l’utilise au début et à la fin). "toto" sera valide mais "toto' sera invalide.

Ensuite, j’ai réussi à trouver le problème en installant Brackets. Cet éditeur est fourni avec un outil JSLint dont les réglages par défaut alertent quand on utilise des fonctionnalités ECMAScript 6 / ES2015 comme let qui est apparu à ce moment. Ces alertes étaient sans doute pertinentes au tout début lorsque la compatibilité de ces (alors nouvelles) fonctionnalités était faible mais ce n’est plus le cas et une grande majorité de développeurs, d’outils, de site et surtout de navigateurs les utilisent :slight_smile:
Ce sont uniquement des alertes et ça n’empêche pas de voir le résultat correct dans un navigateur en ouvrant index.html.

Deux solutions pour éviter d’être embêté.e par ces alertes :

jslint.options": { "es6": true },

  • Installer un éditeur de code avec des réglages et outils peut être un peu plus moderne (let date de 2015 :s) : à titre personnel, j’utilise VS Code et j’en suis très satisfait.

@chrisdavidmills TL;DR Brackets editor embeds JSLint with default settings targeting ES5-like syntax :confused: I’ll check the page about “tools” in the Learning Area to remove mentions of it if any (it should not be a hassle in 2020 to write ES6 code).

Addendum: J’ai retiré la mention de Brackets de cette page de MDN.

#6

Bonjour sphinx_knight

  Merci beaucoup pour ces infos. Je vais certainement opter pour VS

code.

  ps : avec Brackets, le CSS fonctionne bien mais pas JavaScript,

alors que j’ai bien mis la ligne suivante avant la balise fermante

:

J’apprécie beaucoup de pouvoir être ainsi aidé

Cordialement

1 Like