|
| 1 | +--- |
| 2 | +title: Utiliser Bun avec Astro |
| 3 | +description: Apprenez à utiliser Bun avec votre site Astro. |
| 4 | +type: recipe |
| 5 | +i18nReady: true |
| 6 | +--- |
| 7 | + |
| 8 | +[Bun](https://bun.sh/) est un moteur d'exécution et une boîte à outils JavaScript tout-en-un. Voir la [documentation de Bun](https://bun.sh/docs) pour plus d'informations. |
| 9 | + |
| 10 | +:::caution |
| 11 | +Bun a récemment publié sa première version stable. Cependant, l'utilisation de Bun avec Astro peut révéler des imperfections. Certaines intégrations peuvent ne pas fonctionner comme prévu. Consultez [la documentation officielle de Bun pour travailler avec Astro](https://bun.sh/guides/ecosystem/astro) pour plus de détails. |
| 12 | + |
| 13 | +Si vous rencontrez des problèmes lors de l'utilisation de Bun, veuillez [ouvrir un problème sur GitHub avec Bun directement](https://github.com/oven-sh/bun/issues/new/choose). |
| 14 | +::: |
| 15 | + |
| 16 | +## Prérequis |
| 17 | + |
| 18 | +- Bun installé localement sur votre machine. Voir les [instructions d'installation](https://bun.sh/docs/installation) dans la documentation officielle de Bun. |
| 19 | + |
| 20 | +## Créer un nouveau projet Astro avec Bun |
| 21 | + |
| 22 | +Créez un nouveau projet Astro avec Bun en utilisant la commande `create-astro` suivante : |
| 23 | + |
| 24 | +```bash |
| 25 | +bunx create-astro@latest my-astro-project-using-bun |
| 26 | +``` |
| 27 | + |
| 28 | +:::tip |
| 29 | +Vous pouvez également [créer un nouveau projet Astro à partir d'un dépôt Astro GitHub existant](/fr/install/auto/#modèles-de-démarrage) en utilisant l'option `--template` : |
| 30 | +```bash |
| 31 | +bunx create-astro@latest my-astro-project-using-bun --template eliancodes/brutal |
| 32 | +``` |
| 33 | +::: |
| 34 | + |
| 35 | +## Installer les dépendances |
| 36 | + |
| 37 | +Si vous démarrez un nouveau projet en utilisant `bunx create-astro`, le CLI utilisera automatiquement Bun pour installer les dépendances et vous pouvez sauter cette étape. |
| 38 | + |
| 39 | +Sinon, vous devrez installer vos dépendances avec Bun : |
| 40 | + |
| 41 | +```bash |
| 42 | +bun install |
| 43 | +``` |
| 44 | + |
| 45 | +## Ajouter des types |
| 46 | + |
| 47 | +Bun publie le paquet [`@types/bun`](https://www.npmjs.com/package/@types/bun), contenant les types d'exécution pour Bun. |
| 48 | + |
| 49 | +Installez `@types/bun` en utilisant la commande suivante : |
| 50 | + |
| 51 | +```sh |
| 52 | +bun add -d @types/bun |
| 53 | +``` |
| 54 | + |
| 55 | +## Utiliser les intégrations Astro |
| 56 | + |
| 57 | +Vous pouvez également utiliser n'importe laquelle des intégrations officielles d'Astro avec la commande `astro add` : |
| 58 | + |
| 59 | +```bash |
| 60 | +bunx astro add react |
| 61 | +``` |
| 62 | + |
| 63 | +## Exécuter Astro avec Bun |
| 64 | + |
| 65 | +:::note |
| 66 | +Utilisez l'option [`--bun`](https://bun.sh/docs/cli/bunx#shebangs) avant chaque commande `astro` pour utiliser le propre runtime de Bun à la place de Node. |
| 67 | +::: |
| 68 | + |
| 69 | +### Exécuter le serveur de développement |
| 70 | + |
| 71 | +Pour lancer le serveur de développement en utilisant Bun comme runtime, utilisez la commande suivante : |
| 72 | + |
| 73 | +```bash |
| 74 | +bunx --bun astro dev |
| 75 | +``` |
| 76 | + |
| 77 | +### Construire votre site avec Bun |
| 78 | + |
| 79 | +Pour construire votre site en utilisant Bun comme runtime, utilisez la commande suivante : |
| 80 | + |
| 81 | +```bash |
| 82 | +bunx --bun astro build |
| 83 | +``` |
| 84 | + |
| 85 | +Astro produira votre site dans le répertoire `dist/`. Ensuite, vous pouvez servir votre site en utilisant la commande `preview` : |
| 86 | + |
| 87 | +```bash |
| 88 | +bunx --bun astro preview |
| 89 | +``` |
| 90 | + |
| 91 | +## Ajouter SSR avec Bun |
| 92 | + |
| 93 | +Puisque Bun offre la [compatibilité API Node.js](https://bun.sh/docs/runtime/nodejs-apis), vous pouvez utiliser n'importe quel adaptateur Astro pour le [rendu côté serveur](/fr/guides/server-side-rendering/) dans votre projet Astro : |
| 94 | + |
| 95 | +```bash |
| 96 | +bunx astro add vercel |
| 97 | +``` |
| 98 | + |
| 99 | +## Tester dans Bun |
| 100 | + |
| 101 | +Bun est livré avec un programme de test rapide, intégré et compatible avec Jest, via la commande `bun test`. Si vous souhaitez l'utiliser, lisez [la documentation sur `bun test`](https://bun.sh/docs/cli/test). |
| 102 | + |
| 103 | +Cependant, il est également possible d'utiliser Cypress ou Playwright pour une approche moderne des tests d'applications web. |
| 104 | + |
| 105 | +### Cypress |
| 106 | + |
| 107 | +Cypress est un outil de test frontal dont la mission est de "rendre l'expérience de test agréable et de rendre les développeurs heureux". Il vous permet d'écrire des tests de bout en bout pour votre site Astro. |
| 108 | + |
| 109 | +Installez Cypress avec la commande suivante : |
| 110 | + |
| 111 | +```bash |
| 112 | +bun add cypress --dev |
| 113 | +``` |
| 114 | + |
| 115 | +Pour le reste de la configuration et pour lancer votre premier test, suivez le reste de la procédure Cypress dans le [Guide de test d'Astro](/fr/guides/testing/#configuration). |
| 116 | + |
| 117 | +### Playwright |
| 118 | + |
| 119 | +Playwright est un framework de test de bout en bout qui vous permet de tester votre code Astro sur tous les moteurs de rendu modernes, y compris Chromium, WebKit et Firefox. |
| 120 | + |
| 121 | +Installez Playwright à l'aide de la commande suivante : |
| 122 | + |
| 123 | +```bash |
| 124 | +bun create playwright |
| 125 | +``` |
| 126 | + |
| 127 | +Pour créer votre premier test Playwright, suivez les instructions pour le reste du processus Playwright dans le [Astro Testing Guide](/fr/guides/testing/#créez-votre-premier-test-playwright). |
| 128 | + |
| 129 | +## Ressources officielles |
| 130 | + |
| 131 | +- [Construire une application avec Astro et Bun](https://bun.sh/guides/ecosystem/astro) |
| 132 | + |
| 133 | +## Ressources communautaires |
| 134 | + |
| 135 | +Vous utilisez Bun avec Astro ? Ajoutez votre article de blog ou votre vidéo à cette page ! |
| 136 | + |
| 137 | +- [Construire un site Cloudflare Pages avec Bun](https://blog.otterlord.dev/posts/hello-from-bun/) - article de blog |
0 commit comments