| 📦 Turbo JS 91999d1 k33g 10h ago | 1 | # Activer la complétion JavaScript |
| 2 | |
| 3 | 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é. |
| 4 | |
| 5 | 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. |
| 6 | |
| 7 | ## 1. Installer le serveur, avec TypeScript 6 |
| 8 | |
| 9 | ```bash |
| 10 | npm install -g typescript-language-server typescript@6 |
| 11 | ``` |
| 12 | |
| 13 | 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. |
| 14 | |
| 15 | 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. |
| 16 | |
| 17 | ## 2. S'assurer que Turbo JS le trouve |
| 18 | |
| 19 | 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 : |
| 20 | |
| 21 | ```bash |
| 22 | typescript-language-server --version |
| 23 | ``` |
| 24 | |
| 25 | ``` |
| 26 | 6.0.0 |
| 27 | ``` |
| 28 | |
| 29 | 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. |
| 30 | |
| 31 | ## 3. Ouvrir un fichier dans un projet |
| 32 | |
| 33 | ```bash |
| 34 | cd /chemin/vers/votre/projet |
| 35 | turbo-js src/index.js |
| 36 | ``` |
| 37 | |
| 38 | 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. |
| 39 | |
| 40 | 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`. |
| 41 | |
| 42 | ## 4. Demander une complétion |
| 43 | |
| 44 | Tapez un nom et un point, ou les premières lettres d'un nom et **Ctrl-Espace** : |
| 45 | |
| 46 | ```javascript |
| 47 | const text = "hello"; |
| 48 | text. |
| 49 | ``` |
| 50 | |
| 51 | 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. |
| 52 | |
| 53 | ## Ce que contient la liste |
| 54 | |
| 55 | `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 : |
| 56 | |
| 57 | | Proposé | Exemple | |
| 58 | | --- | --- | |
| 59 | | 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` | |
| 60 | | Les membres d'une valeur, d'après son type inféré | `text.` → les méthodes de String ; `process.` → `argv`, `env`, `exit` | |
| 61 | | 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"` | |
| 62 | | Les globales de Node et celles de la bibliothèque standard | `console`, `Buffer`, `setTimeout`, `structuredClone` | |
| 63 | | Les mots-clés | `async`, `await`, `class` | |
| 64 | |
| 65 | ## Vérifier ce que fait le serveur |
| 66 | |
| 67 | 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 : |
| 68 | |
| 69 | ``` |
| 70 | LSP: no typescript-language-server — npm install -g typescript-language-server typescript@6 |
| 71 | ``` |
| 72 | |
| 73 | `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é. |
| 74 | |
| 75 | ## Variantes |
| 76 | |
| 77 | **Vous ne voulez aucun serveur de langage :** |
| 78 | |
| 79 | ```bash |
| 80 | turbo-js -no-lsp main.js |
| 81 | ``` |
| 82 | |
| 83 | **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. |
| 84 | |
| 85 | **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. |
| 86 | |
| 87 | **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. |
| 88 | |
| 89 | **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. |
| 90 | |
| 91 | **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 `.`. |
| 92 | |
| 93 | **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. |
| 94 | |
| 95 | **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. |
| 96 | |
| 97 | **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. |
| 98 | |
| 99 | ## Ce que le serveur donne d'autre |
| 100 | |
| 101 | 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. |
| 102 | |
| 103 | | Touche | Ce qu'elle fait | Avec `typescript-language-server` | |
| 104 | | --- | --- | --- | |
| 105 | | **Ctrl-Espace** | La liste de complétion | oui | |
| 106 | | **F1** | Décrire le symbole sous le curseur | oui — sa signature, et le commentaire JSDoc écrit juste au-dessus d'une déclaration à vous | |
| 107 | | **F12** | Aller là où il est déclaré | oui, dans ce fichier ou un autre | |
| 108 | | **Shift-F12** | Lister tous ses usages | oui — la déclaration et chaque appel, en liste où choisir | |
| 109 | | **Ctrl-T** | Trouver un symbole par son nom dans tout le projet | oui | |
| 110 | |
| 111 | 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. |
| 112 | |
| 113 | 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. |
| 114 | |
| 115 | ## Les marques d'erreur |
| 116 | |
| 117 | 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. |
| 118 | |
| 119 | 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. |
| 120 | |
| 121 | [Interroger le code](ask-about-code.md) parcourt le menu Code. |
| 122 | |
| 123 | ## Voir aussi |
| 124 | |
| 125 | - Pourquoi le serveur est optionnel, et pourquoi c'est celui de TypeScript : [Coloration et complétion](../explanation/colouring-and-completion.md) |
| 126 | - Obtenir Node et npm : [Installer Node.js](install-node.md) |
| 127 | - Toutes les touches : [référence du clavier](../reference/keyboard.md) |