Un seul ensemble d’outils pour votre projet web

Formatez, lintez, et plus, en une fraction de seconde.

Formatez du code comme Prettier, gagnez du temps

Biome est un outil de formatage rapide pour JavaScript, TypeScript, JSX, TSX, JSON, CSS et GraphQL qui atteint 97 % de compatibilité avec Prettier, faisant gagner du temps aux serveurs d’Intégration Continue et aux développeurs.

Biome peut même formater du code malformé pendant que vous l’écrivez dans votre éditeur favori.

CODE

function HelloWorld({greeting = "hello", greeted = '"World"', silent = false, onMouseOver,}) {

  if(!greeting){return null};

      // TODO: Don't use random in render
  let num = Math.floor (Math.random() * 1E+7).toString().replace(/.d+/ig, "")

  return <div className='HelloWorld' title={`You are visitor number ${ num }`} onMouseOver={onMouseOver}>

    <strong>{ greeting.slice( 0, 1 ).toUpperCase() + greeting.slice(1).toLowerCase() }</strong>
    {greeting.endsWith(",") ? " " : <span style={{color: 'grey'}}>", "</span> }
    <em>
  { greeted }
    </em>
    { (silent)
      ? "."
      : "!"}

    </div>;
}

SORTIE

function HelloWorld({
  greeting = "hello",
  greeted = '"World"',
  silent = false,
  onMouseOver,
}) {
  if (!greeting) {
    return null;
  }

  // TODO: Don't use random in render
  let num = Math.floor(Math.random() * 1E+7)
    .toString()
    .replace(/.d+/gi, "");

  return (
    <div
      className="HelloWorld"
      title={`You are visitor number ${num}`}
      onMouseOver={onMouseOver}
    >
      <strong>
        {greeting.slice(0, 1).toUpperCase() + greeting.slice(1).toLowerCase()}
      </strong>
      {greeting.endsWith(",") ? (
        " "
      ) : (
        <span style={{ color: "grey" }}>", "</span>
      )}
      <em>{greeted}</em>
      {silent ? "." : "!"}
    </div>
  );
}

PERFORMANCE

Biome

0.00s

Prettier

0.00s

~35x

Plus vite que Prettier en formatant 171 127 lignes de code dans 2 104 fichiers avec un Intel Core i7 1270P.

Essayez l’outil de formatage de Biome dans le bac à sable ou directement dans votre projet :

npm i -D --save-exact @biomejs/biome
npx @biomejs/biome format --write ./src

Résolvez les problèmes, apprenez les bonnes pratiques

Biome est un outil de linting performant pour JavaScript, TypeScript, JSX, CSS et GraphQL qui comprend 302 règles d’ESLint, de TypeScript ESLint et d’autres sources.

Biome fournit des diagnostics détaillés et contextualisés qui vous aident à améliorer votre code et à devenir un meilleur programmeur !

complexity/useFlatMap.js:2:1 lint/complexity/useFlatMap  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ The call chain .map().flat() can be replaced with a single .flatMap() call.

    1 │ const array = ["split", "the text", "into words"];
  > 2 │ array.map(sentence => sentence.split(' ')).flat();
      │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    3 │ 

  ℹ Safe fix: Replace the chain with .flatMap().

    1 1 │   const array = ["split", "the text", "into words"];
    2   │ - array.map(sentence·=>·sentence.split('·')).flat();
      2 │ + array.flatMap(sentence·=>·sentence.split('·'));
    3 3 │

Essayez l’outil de linting de Biome dans le bac à sable ou directement dans votre projet :

npm i -D --save-exact @biomejs/biome
npx @biomejs/biome lint --write ./src

Tout en même temps

Non seulement vous pouvez formater et linter votre code séparément, mais vous pouvez le faire en même temps avec une seule commande !

Les outils s’intègrent les uns aux autres pour créer un ensemble d’outils cohérent pour les projets web.

Exécutez tous les outils avec la commande check :

npm i -D --save-exact @biomejs/biome
npx @biomejs/biome check --write ./src

Rapide

Développé en Rust et avec une architecture innovante inspirée de rust-analyzer.

Simple

Zéro configuration nécessaire pour démarrer. Beaucoup d’options disponibles pour les moments où vous en aurez besoin.

Évolutif

Conçu pour prendre en charge des bases de code de n’importe quelle taille. Concentrez-vous sur la croissance du produit au lieu de vous concentrer sur vos outils.

Optimisé

Avec une bonne intégration interne, nous sommes capables de réutiliser du travail précédent et toute amélioration apportée à un outil les améliore tous.

Pratique & instructif

Évitez d’obscurs messages d’erreur : quand nous vous disons que quelque chose ne va pas, nous vous disons exactement où se trouve le problème et comment le résoudre.

Batteries incluses

Prise en charge clé en main de toutes les caractéristiques des langages que vous utilisez aujourd’hui. Prise en charge native de TypeScript et de JSX.