Lancer des commandes Node depuis l'éditeur

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236

# Lancer des commandes Node depuis l'éditeur

Ce guide montre comment installer, formater, linter, tester et exécuter votre projet sans quitter Turbo JS. Il suppose que l'éditeur est installé et que vous avez un répertoire contenant un `package.json`.

## Obtenir un fichier de départ

Lancez l'éditeur **depuis le répertoire qui contient `package.json`**, puis choisissez **JavaScript ▸ Create tools file** (`Alt-J`, puis `C`).

Cela écrit `.turbo-js/tools.toml` avec les commandes qu'un projet Node lance le plus, et l'ouvre. Les trois premières :

```toml
[[tool]]
name = "~I~nstall"
command = "npm install"
output = "popup"

[[tool]]
name = "~F~ormat"
command = "npx prettier --write ."
output = "popup"

[[tool]]
name = "~L~int"
command = "npx eslint ."
output = "popup"
```

Chaque `[[tool]]` devient une ligne du menu **JavaScript**, dans l'ordre d'apparition — sauf s'il nomme un `menu` à lui, ce qu'une section plus bas couvre. Le fichier est lu à chaque ouverture du menu, une modification prend donc effet immédiatement.

## En lancer une

`Alt-J`, puis la lettre entre les tildes — `I` pour installer, `T` pour tester.

**Test** ouvre aussitôt un **popup**, qui se remplit pendant que la commande tourne. Son titre porte la commande et, une fois finie, comment cela s'est passé :

```
┌──────────────── node --test — ok ─────────────────┐
│  ✔ greets by name (1.204ms)                        │
│  ℹ tests 1                                         │
│  ℹ suites 0                                        │
│  ℹ pass 1                                          │
│  ℹ fail 0                                          │
│                                                    │
│                     [ Close ]                      │
└────────────────────────────────────────────────────┘
```

| Touche | Effet |
| --- | --- |
| `↑` `↓` `PgUp` `PgDn` `Home` `End` | Parcourir la sortie |
| `Échap` | Le fermer — et **arrêter la commande** si elle tourne encore |
| `Entrée` | Le fermer |

Une commande qui a réussi en silence — `npx prettier --write .` sur un projet déjà formaté — affiche `(no output)` plutôt qu'une boîte vide, pour qu'on la distingue d'une commande qui n'a pas démarré.

**Run** demande d'abord, parce qu'un projet Node n'a pas de point d'entrée unique que l'éditeur pourrait connaître :

```
┌──────────────── Run ────────────────┐
│  script, e.g. main.js               │
│  [                               ]  │
└─────────────────────────────────────┘
```

Tapez `main.js` et appuyez sur `Entrée`. Une fenêtre de terminal s'ouvre et le script s'y exécute ; quand il finit la fenêtre reste, montrant ce qu'il a imprimé. Appuyez sur `Ctrl-W` pour la fermer. Relancez-le et la boîte se souvient du nom pour le reste de la session.

## Le reste du menu

| Entrée | Ce qu'elle lance | Où |
| --- | --- | --- |
| **Install** | `npm install` — les dépendances que nomme `package.json`, dans `node_modules/` | un popup |
| **Format** | `npx prettier --write .` — Prettier sur tout le projet | un popup ; les fichiers ouverts sont relus ensuite |
| **Lint** | `npx eslint .` — ESLint sur tout le projet | un popup ; ESLint 9 a besoin d'un `eslint.config.js` |
| **Test** | `node --test` — le lanceur de Node lui-même sur chaque `*.test.js`, `*.spec.js` et `test/**/*.js` | un popup |
| **Run** | `node <script>` — le script que vous nommez | un terminal, parce qu'un script peut lire le clavier |
| **Start** | `npm start` — ce que dit le script `start` de `package.json` | un terminal, parce que c'est d'ordinaire un serveur |

`npx` lance le Prettier et l'ESLint du projet lui-même quand `package.json` en dépend, et sinon les télécharge dans le cache de npm la première fois — c'est pourquoi le premier **Format** sur une machine prend quelques secondes et le second non.

`npm install` peut prendre du temps. Le popup est modal, pendant qu'il tourne vous ne pouvez taper nulle part ailleurs ; `Échap` le ferme et arrête l'installation.

## Choisir où va la sortie

Réglez `output` sur un outil :

| `output` | Ce que vous obtenez |
| --- | --- |
| `popup` | Un dialogue qui se remplit pendant l'exécution. Le défaut. |
| `terminal` | Une fenêtre de terminal : les couleurs, `Ctrl-C`, et le clavier atteint le programme |
| `editor` | Une fenêtre d'édition une fois fini, pour fouiller avec `Ctrl-F` |

`Run` et `Start` sont en `terminal` dans le fichier de départ, et ils sont l'exemple de la raison d'être de la clé : un popup ne peut pas répondre à un script qui lit `process.stdin`, et ne peut pas être interrompu par `Ctrl-C` pendant qu'un serveur écoute.

Prenez `editor` quand la sortie est quelque chose à parcourir — l'arbre que `npm ls` imprime, ou un long rapport de tests que vous voulez fouiller.

## Une commande longue retient l'éditeur

Un popup est modal : pendant que `npm install` tourne, vous ne pouvez taper nulle part ailleurs. `Échap` le ferme et arrête la commande.

Si cela gêne pour une commande donnée, donnez-lui `output = "terminal"` — la fenêtre est une fenêtre ordinaire et vous pouvez continuer à travailler à côté. C'est à cela que sert la clé configurable.

## Ce qui arrive à vos fichiers ouverts

`npx prettier --write .` réécrit le fichier que vous regardez, `npm install` écrit `node_modules/` et `package-lock.json` dans le répertoire, et un outil à vous peut faire n'importe quoi. Quand une commande se termine, l'éditeur **relit tous les fichiers ouverts qui n'ont pas de modifications non enregistrées**, un fichier qu'une autre commande a changé apparaît donc tel qu'il est désormais, et l'arbre du projet est rafraîchi pour qu'un nouveau fichier s'y montre. La barre d'état dit combien.

Un fichier avec des modifications non enregistrées est **laissé tranquille**, et la barre d'état le dit aussi :

```
Reloaded 2 files; 1 file with unsaved changes left alone
```

C'est délibéré : votre modification et la commande sont réellement en désaccord, et ce n'est pas à l'éditeur de décider qui l'emporte. Enregistrez d'abord (`F2`) et relancez la commande, ou continuez à éditer. Avec **Format** en particulier : enregistrez, puis formatez, sinon le travail de Prettier sur ce fichier est ignoré.

## Ajouter vos propres commandes

Éditez `.turbo-js/tools.toml`. Une commande va à `sh -c`, une entrée peut donc être une séquence entière :

```toml
[[tool]]
name = "~C~heck"
command = "node --check {{script, e.g. main.js}}"
output = "popup"

[[tool]]
name = "Lint and ~t~est"
command = "npx eslint . && node --test"
output = "popup"

[[tool]]
name = "~W~atch"
command = "node --watch {{script, e.g. server.js}}"
output = "terminal"

[[tool]]
name = "~D~ependencies"
command = "npm ls --all"
output = "editor"
```

Donnez à chacune une touche chaude entre tildes, et gardez-les distinctes — le menu répond à la première correspondance qu'il trouve.

## Mettre un outil dans un menu à lui

Un outil qui n'a rien à voir avec JavaScript n'a pas sa place dans le menu JavaScript. Donnez-lui un `menu` :

```toml
[[tool]]
name = "~E~cho"
command = "echo TADA"
output = "terminal"
menu = "Tools"

[[tool]]
name = "~U~p"
command = "docker compose up -d"
menu = "Docker"

[[tool]]
name = "~D~own"
command = "docker compose down"
menu = "Docker"
```

Cela vous donne un menu **Tools** et un menu **Docker** sur la barre, entre JavaScript et Help, dans l'ordre où les noms apparaissent pour la première fois dans le fichier. Docker contient ses deux outils. Rien à redémarrer : enregistrez le fichier et la barre suit.

Le nom est à vous — il n'y a pas de liste où choisir. Omettez `menu` et l'outil reste dans JavaScript, où sont six des sept commandes de départ.

### La touche chaude est choisie pour vous

Vous ne pouvez pas savoir, en écrivant le fichier, quelles lettres les menus propres de l'éditeur ont prises. Il le calcule donc : la première lettre du nom que rien d'autre ne revendique reçoit les tildes.

`Tools` obtient `Alt-T`, parce que `T` est libre. Un menu appelé `Format` obtiendrait `Alt-M`, parce que `F` est à File, `o` à Options et `r` à Run. Un menu appelé `Jobs` obtiendrait `Alt-B`, parce que `J` est à JavaScript et `o` à Options.

Écrivez les tildes vous-même — `menu = "Doc~k~er"` — et une lettre libre est conservée. Une lettre prise ne l'est pas : la barre répond au *premier* menu qui correspond à une touche, honorer votre choix rendrait donc l'un des deux menus inatteignable. Il choisit une autre lettre et ne dit rien.

## Variantes

- **Votre projet utilise pnpm, Yarn ou Bun.** Remplacez `npm install` par `pnpm install`, `npx eslint .` par `pnpm exec eslint .`, et ainsi de suite. Le fichier de départ est en npm parce que npm est livré avec Node ; rien dans l'éditeur ne sait quel gestionnaire de paquets tourne.
- **Vous avez un seul script et jamais un autre.** Remplacez `node {{script, e.g. main.js}}` par `node main.js`, et la boîte cesse d'apparaître. Le champ est là parce qu'un fichier de départ ne peut pas savoir quel fichier est le programme.
- **Vos tests utilisent Vitest, Jest ou Mocha.** Remplacez `node --test` par `npx vitest run`, `npx jest` ou `npx mocha`. `npm test` marche aussi, si `package.json` a un script `test` qui n'est pas le `echo "Error: no test specified"` que npm écrit par défaut.
- **Vous avez lancé l'éditeur depuis un sous-répertoire.** Les commandes s'y exécutent, et `npm` cherche `package.json` là et dans les répertoires au-dessus — mais `npx prettier --write .` ne formate que ce sous-répertoire. Partez du répertoire où est `package.json`.
- **Le fichier contient une erreur.** Le menu affiche un `Cannot read tools` grisé à la place des commandes, et **Create tools file** est toujours là.
- **`npx eslint .` dit qu'il ne trouve pas de fichier de configuration.** ESLint 9 lit `eslint.config.js` ; `npm init @eslint/config@latest` en écrit un. Les projets plus anciens ont un `.eslintrc.json`, qu'ESLint 9 ne lit plus.
- **Vous voulez un menu du nom d'un qui existe.** `menu = "File"` vous donne un second menu File, plus loin sur la barre, avec une autre touche chaude. Rien ne l'empêche ; rien ne le recommande non plus.
- **Votre menu n'a pas de touche chaude.** Toutes les lettres de son nom étaient déjà prises. `F10` et les flèches l'atteignent, et la souris aussi. Renommez-le avec une lettre libre.
- **Vous avez mal orthographié la valeur d'`output`.** Tout le fichier est refusé et le menu dit `Cannot read tools`, en nommant l'outil et en listant ce que la valeur aurait pu être. Un repli silencieux aurait envoyé la sortie quelque part où vous ne l'aviez pas demandée.

## Demander une valeur à l'exécution

`Run` le fait déjà. Le motif est un `{{libellé}}` là où va la valeur :

```toml
[[tool]]
name = "~A~dd a package"
command = "npm install {{package name}}"
output = "popup"
```

La choisir ouvre une boîte titrée **Add a package** avec un champ, libellé `package name`. **Entrée** lance la commande. Échap, et rien ne se lance. Plusieurs marqueurs donnent plusieurs champs, dans leur ordre d'apparition ; **Tab** passe de l'un à l'autre.

La valeur est citée, un chemin avec un espace reste donc un seul argument.

### Un champ pour plusieurs arguments

Citer est faux quand on veut dire « mets ceci à la fin ». Ajoutez `...` dans les accolades et la valeur passe telle quelle :

```toml
[[tool]]
name = "Run with ~a~rguments"
command = "node main.js {{arguments...}}"
output = "terminal"
```

Tapez `--verbose input.txt` et les deux atteignent le script comme des arguments séparés — `process.argv.slice(2)` les contient.

### La même valeur deux fois

Écrivez le libellé deux fois ; on vous la demande une fois :

```toml
[[tool]]
name = "Test ~o~ne"
command = "node --test {{file}} && node --check {{file}}"
```

### Variantes

- **La valeur est la même la plupart du temps.** Lancez une fois et la boîte se souvient de ce que vous avez tapé, pour le reste de la session. Ce n'est pas écrit sur le disque.
- **Votre commande a déjà des accolades.** `awk '{print $1}'` et `find . -exec rm {} +` sont laissés tranquilles : seules les doubles accolades demandent quelque chose. De même un `${x}` JavaScript dans une ligne `node -e` — une accolade, pas deux.
- **La commande demande plus de valeurs qu'il n'en tient à l'écran.** L'éditeur le dit plutôt que d'ouvrir une boîte dont le bouton OK est sous le bas du terminal. Agrandissez le terminal, ou coupez la commande en deux outils.

## Voir aussi

- Chaque clé du fichier et chaque règle : [Référence des outils JavaScript](../reference/javascript-tools.md)
- Pourquoi Install vient en premier, et pourquoi un fichier non modifié se recharge : [Outils JavaScript](../explanation/javascript-tools.md)
- Les fenêtres dans lesquelles les commandes tournent : [Fenêtres de terminal](../reference/terminal.md)