Skip to content

Commit 00d6dc3

Browse files
i18n(fr): add experimental-flags/chrome-devtools-workspace.mdx
See withastro#12144
1 parent 326a232 commit 00d6dc3

File tree

1 file changed

+51
-0
lines changed

1 file changed

+51
-0
lines changed
Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
---
2+
title: Espace de travail expérimental dans Chrome DevTools
3+
sidebar:
4+
label: Espace de travail dans Chrome DevTools
5+
i18nReady: true
6+
---
7+
8+
import Since from '~/components/Since.astro';
9+
import { Steps } from '@astrojs/starlight/components';
10+
11+
12+
<p>
13+
14+
**Type :** `boolean`<br />
15+
**Par défaut :** `false`<br />
16+
<Since v="5.13.0" />
17+
</p>
18+
19+
Active l'[intégration expérimentale d'un espace de travail dans Chrome DevTools](https://developer.chrome.com/docs/devtools/workspaces) pour le serveur de développement Astro.
20+
21+
Cette fonctionnalité vous permet de modifier des fichiers directement dans Chrome DevTools et de répercuter ces modifications dans votre système de fichiers local via un dossier d'espace de travail connecté. Ceci est utile pour appliquer des modifications, comme l'ajustement des valeurs CSS, sans quitter l'onglet de votre navigateur.
22+
23+
Avec cette fonctionnalité activée, l'exécution de `astro dev` configurera automatiquement un espace de travail dans Chrome DevTools pour votre projet. Ce dernier apparaîtra alors comme une [source d'espace de travail disponible à laquelle vous pouvez vous connecter](#connecter-votre-projet). Les modifications apportées dans le panneau « Sources » seront alors automatiquement enregistrées dans le code source de votre projet.
24+
25+
Pour activer cette fonctionnalité, ajoutez l'option expérimentale `chromeDevtoolsWorkspace` à votre configuration Astro :
26+
27+
```js title="astro.config.mjs" ins={4-6}
28+
import { defineConfig } from 'astro/config';
29+
30+
export default defineConfig({
31+
experimental: {
32+
chromeDevtoolsWorkspace: true,
33+
},
34+
});
35+
```
36+
37+
## Connecter votre projet
38+
39+
Astro créera le fichier de configuration nécessaire à la prise en charge des espaces de travail dans Chrome DevTools. Cependant, votre projet doit également être [connecté en tant que source](https://developer.chrome.com/docs/devtools/workspaces#manual-connection) pour permettre l'enregistrement des fichiers.
40+
41+
<Steps>
42+
43+
1. [Démarrez le serveur de développement d'Astro](/fr/develop-and-build/#démarrer-le-serveur-de-développement-dastro) avec la commande CLI appropriée pour votre gestionnaire de paquets.
44+
45+
2. Accédez à l'aperçu de votre site (par exemple `http://localhost:4321/`) dans Chrome et ouvrez DevTools.
46+
47+
3. Sous l'onglet **Sources** > **Espace de travail**, vous trouverez le dossier de votre projet Astro. Cliquez sur **Connecter** pour ajouter votre répertoire comme espace de travail.
48+
49+
</Steps>
50+
51+
Consultez la [documentation des espaces de travail dans Chrome DevTools](https://developer.chrome.com/docs/devtools/workspaces#connect) pour plus d'informations.

0 commit comments

Comments
 (0)