# Activer la complétion JavaScript Ce guide montre comment obtenir la complétion, les survols, l'aller-à-la-définition, les références et les marques d'erreur. Il suppose que Turbo JS est déjà installé. La complétion vient de **`typescript-language-server`**, un serveur de langage au-dessus de `tsserver` — le moteur derrière le support JavaScript de tous les éditeurs — qui sert le JavaScript pur aussi bien que TypeScript. Turbo JS ne l'embarque pas : l'édition et la coloration marchent sans lui, et seuls la complétion, le menu Code et les marques d'erreur manquent. ## 1. Installer le serveur, avec TypeScript 6 ```bash npm install -g typescript-language-server typescript@6 ``` Deux paquets, et le `@6` n'est pas facultatif. Le serveur est une fine couche au-dessus du `tsserver.js` du paquet `typescript`, et il ne dépend pas de ce paquet, les deux doivent donc être installés. **TypeScript 7 — la version majeure courante — ne livre aucun `tsserver.js`** : c'est le portage natif, avec un serveur de langage à lui dans son compilateur, et un `typescript-language-server` installé à côté démarre puis refuse avec *Could not find a valid TypeScript installation*. TypeScript 6 est la dernière version qui livre le fichier. L'installeur de Turbo JS fera cela pour vous : `scripts/install.sh --with-server`. [Installer Node.js](install-node.md) couvre l'obtention de `npm` lui-même. ## 2. S'assurer que Turbo JS le trouve Turbo JS regarde d'abord sur le `PATH`, puis là où `npm install -g` écrit sur une machine qui utilise un gestionnaire de versions : `$NVM_BIN`, `$NPM_CONFIG_PREFIX/bin` ou `~/.npm-global/bin`, `$PNPM_HOME`, `$VOLTA_HOME/bin` ou `~/.volta/bin`, puis `/usr/local/bin` et `/opt/homebrew/bin`. Vérifiez : ```bash typescript-language-server --version ``` ``` 6.0.0 ``` Si cela dit « command not found » mais que Turbo JS le trouve quand même, c'est attendu et sans conséquence : l'éditeur a fouillé les répertoires ci-dessus lui-même. ## 3. Ouvrir un fichier dans un projet ```bash cd /chemin/vers/votre/projet turbo-js src/index.js ``` Le serveur est démarré dans la **racine du projet** — le répertoire le plus proche, au niveau du fichier ouvert ou au-dessus, qui contient un `package.json`. C'est là qu'est `node_modules/` et de là que `import` et `require` se résolvent, c'est donc ce qui décide quels modules le serveur connaît. Un fichier sans aucun `package.json` au-dessus de lui reçoit le répertoire courant, et le serveur déduit un projet des fichiers qu'on lui montre. L'endroit d'où vous *lancez* l'éditeur décide où s'exécutent les commandes du menu JavaScript, ce qui est une autre affaire : lancez-le aussi depuis le répertoire qui contient `package.json`. ## 4. Demander une complétion Tapez un nom et un point, ou les premières lettres d'un nom et **Ctrl-Espace** : ```javascript const text = "hello"; text. ``` Une liste se déroule sous le curseur — `charAt`, `length`, `toUpperCase`, avec leurs signatures. Continuez à taper pour la réduire, **↑ ↓** pour la parcourir, **Entrée** ou **Tab** pour accepter, **Échap** pour l'écarter. ## Ce que contient la liste `tsserver` infère des types à travers un langage qui n'en déclare aucun, la liste porte donc sur ce que votre code *est* plutôt que sur ce qu'il dit : | Proposé | Exemple | | --- | --- | | Tous les noms dans la portée — variables, fonctions, classes, paramètres — y compris ceux tapés il y a une seconde et pas encore enregistrés | votre propre `helper` | | Les membres d'une valeur, d'après son type inféré | `text.` → les méthodes de String ; `process.` → `argv`, `env`, `exit` | | Les exports d'un module que vous avez importé, et les modules sous `node_modules/` quand vous tapez un `from "` | `import { readFile } from "node:fs/promises"` | | Les globales de Node et celles de la bibliothèque standard | `console`, `Buffer`, `setTimeout`, `structuredClone` | | Les mots-clés | `async`, `await`, `class` | ## Vérifier ce que fait le serveur L'extrémité droite de la barre d'état montre l'état du serveur de langage : `LSP: starting…`, `LSP: ready`, ou la raison pour laquelle il n'y en a pas : ``` LSP: no typescript-language-server — npm install -g typescript-language-server typescript@6 ``` `Run ▸ Language server status` montre la même chose dans une boîte, avec le chemin où le serveur a été trouvé et le répertoire où il a été démarré. ## Variantes **Vous ne voulez aucun serveur de langage :** ```bash turbo-js -no-lsp main.js ``` **La complétion est morte dans une fenêtre née sans nom.** Une fenêtre « Untitled » n'a aucun fichier à annoncer au serveur tant qu'elle n'est pas enregistrée — appuyez sur **F2** et donnez-lui un nom en `.js`, quelque part sous le projet. Dès cette sauvegarde, la complétion, le survol et les marques d'erreur fonctionnent dans cette fenêtre ; inutile de quitter et relancer l'éditeur. **Le serveur démarre puis meurt.** Lancez-le à la main : `echo | typescript-language-server --stdio`. S'il imprime *Could not find a valid TypeScript installation*, le paquet `typescript` à côté de lui est en version 7 — `npm ls -g typescript` le dit — et `npm install -g typescript@6` le corrige. Un projet qui a son propre `typescript` dans `node_modules/` est utilisé de préférence au global, un projet sur TypeScript 7 reçoit donc le même message : ajoutez `typescript@6` à ses dépendances de développement, ou pointez le serveur ailleurs. **La complétion marche mais rien n'est jamais souligné.** Pour un fichier `.js` pur le serveur ne signale que les **erreurs de syntaxe**. Les erreurs de type — appeler une méthode qui n'existe pas, passer une chaîne là où va un nombre — exigent `// @ts-check` en première ligne du fichier, ou un `jsconfig.json` dans le projet avec `"checkJs": true`. Les deux sont la conception du serveur, pas celle de l'éditeur. **La liste est vide juste après le démarrage de l'éditeur.** `tsserver` charge le projet après avoir dit qu'il est prêt, et répond une liste vide tant qu'il n'a pas fini. Redemandez une seconde plus tard. **Ctrl-Espace ne fait rien.** tmux, screen et les terminaux des IDE s'approprient fréquemment `Ctrl-Espace` avant que l'éditeur le voie. Utilisez `Run ▸ Completion` à la place, ou tapez un `.`. **Une requête prend trop longtemps.** Chaque requête abandonne après quelques secondes, un serveur bloqué ralentit donc l'éditeur mais ne le fige jamais. La barre d'état signale l'échec. **Vous avez installé le serveur à un endroit inhabituel.** L'éditeur cherche sur le `PATH` et dans les répertoires listés plus haut, et nulle part ailleurs. Mettez le répertoire sur le `PATH`, ou définissez la variable que votre gestionnaire de versions définit — `NVM_BIN`, `PNPM_HOME`, `VOLTA_HOME` — dans le shell d'où vous lancez l'éditeur. **Vous préféreriez le serveur de TypeScript 7 lui-même.** `tsc --lsp --stdio`, du paquet `typescript`, répond à toutes les questions que cet éditeur pose, plus vite, et ne publie **aucun diagnostic** : il les propose en mode *pull*, ce que turbo-core ne demande pas, la gouttière resterait donc vide. C'est pourquoi ce n'est pas le défaut. [L'explication](../explanation/colouring-and-completion.md) donne la mesure. ## Ce que le serveur donne d'autre La complétion est la chose la plus bruyante qu'il fait et la moindre de ce qu'il sait. La même connexion répond à huit autres questions, toutes dans le menu **Code** et toutes à propos du symbole sous le curseur — aucune sélection nécessaire. | Touche | Ce qu'elle fait | Avec `typescript-language-server` | | --- | --- | --- | | **Ctrl-Espace** | La liste de complétion | oui | | **F1** | Décrire le symbole sous le curseur | oui — sa signature, et le commentaire JSDoc écrit juste au-dessus d'une déclaration à vous | | **F12** | Aller là où il est déclaré | oui, dans ce fichier ou un autre | | **Shift-F12** | Lister tous ses usages | oui — la déclaration et chaque appel, en liste où choisir | | **Ctrl-T** | Trouver un symbole par son nom dans tout le projet | oui | Et, sans touche : *Go to type definition* mène de `const shape = new Circle()` à `class Circle` ; *Find implementations…* sur une classe liste ses sous-classes ; *Symbol in file…* liste les fonctions et classes du fichier, les méthodes de chaque classe imbriquées sous elle ; *Problems…* liste tous les diagnostics. Les neuf questions reçoivent une réponse, et un test de ce dépôt pilote chacune d'elles contre le vrai serveur, ce tableau ne peut donc pas vieillir en silence. ## Les marques d'erreur Les problèmes que le serveur trouve arrivent sans qu'on les demande, à l'ouverture et à chaque modification. La première erreur du fichier que vous éditez apparaît à droite de la barre d'état, précédée de `⚠` ; chaque ligne à problème reçoit un `×` dans la gouttière ; et **Code ▸ Problems…** les liste toutes. Pour un fichier `.js` pur ce sont des **erreurs de syntaxe** — un crochet manquant, un token inattendu — signalées à la colonne exacte. Les erreurs de type exigent `// @ts-check` ou `checkJs`, comme ci-dessus. Un programme qui parse puis échoue à l'exécution ne reçoit aucune marque : le serveur n'exécute jamais rien. [Interroger le code](ask-about-code.md) parcourt le menu Code. ## Voir aussi - Pourquoi le serveur est optionnel, et pourquoi c'est celui de TypeScript : [Coloration et complétion](../explanation/colouring-and-completion.md) - Obtenir Node et npm : [Installer Node.js](install-node.md) - Toutes les touches : [référence du clavier](../reference/keyboard.md)