Aller au contenu principal

Prettier 1.11 : Corrections CSS et prise en charge des nouvelles fonctionnalités TypeScript

· 20 minutes de lecture
Lily Skye
Lily Skye
Traduction Bêta Non Officielle

Cette page a été traduite par PageTurner AI (bêta). Non approuvée officiellement par le projet. Vous avez trouvé une erreur ? Signaler un problème →

Cette version propose une multitude de corrections de formatage CSS ainsi que la prise en charge de nouvelles fonctionnalités TypeScript, en plus de corrections générales pour d'autres langages.

Depuis la dernière version, le site Prettier bénéficie d'un tout nouveau design grâce à @orta !

Facebook est désormais 💯% Prettier​

Autre annonce passionnante : tous les fichiers JavaScript de la base de code Facebook ont été convertis à Prettier ! Ce qui est impressionnant, c'est qu'il n'y a pas eu d'effort concerté pour cette migration : nous avons simplement mis en place l'outillage et documenté la procédure de migration dossier par dossier, et les développeurs ont spontanément commencé à convertir leurs parties du codebase.

En 8 mois, 75% du codebase avait été converti organiquement, et la semaine dernière nous avons finalisé la migration du reste en imposant que chaque nouveau fichier utilise Prettier ! Cela démontre que Prettier est suffisamment robuste pour gérer tous les cas limites imaginables et qu'il apporte une valeur significative, vu son taux d'adoption spectaculaire.

Principales fonctionnalités​

CSS/SCSS/Less​

Notre formateur CSS a reçu beaucoup d'amour de @evilebottnawi dans cette version !

Formatage des at-rules (#3828 par @evilebottnawi)​

Auparavant, certaines at-rules (comme @if et @include) n'étaient pas formatées par Prettier et restaient imprimées telles quelles. Elles sont désormais correctement formatées :

// Before:
.selector {
  @include absolute($top: $long-variable-name, $right: $long-variable-name, $left: auto, $bottom: auto);
}

// After:
.selector {
  @include absolute(
    $top: $long-variable-name,
    $right: $long-variable-name,
    $left: auto,
    $bottom: auto
  );
}

Prise en charge des plugins PostCSS populaires (#3959 par @evilebottnawi)​

Certains plugins PostCSS populaires comme postcss-mixins dysfonctionnaient à cause du formatage CSS appliqué par Prettier. Ces plugins sont désormais correctement pris en compte :

// Before
$theme: blue;

a {
  @mixin $(theme) -colors;
}

// After
$theme: blue;

a {
  @mixin $(theme)-colors;
}

Prise en charge des blocs YAML front-matter en SCSS (#3802 par @evilebottnawi)​

Jekyll s'appuie sur le YAML front-matter pour détecter les fichiers SCSS, mais Prettier le supprimait, ce qui cassait les sites Jekyll au déploiement. Le YAML front-matter est désormais conservé, préservant ainsi le style :

---
title: Title
description: Description
---

a {
  color: red;
}

TypeScript​

Prise en charge de l'affectation définitive (!:) (#4020 par @ikatyang)​

TypeScript 2.7 a introduit l'affectation définitive, utilisable dans les initialiseurs de propriétés de classe. Cela indique à TypeScript que même sans initialiseur, la propriété aura une valeur au runtime (et non undefined) :

class MyComponent {
  ngModel!: ng.INgModelController;
}

Prettier 1.10.2 ne pouvait pas parser cette syntaxe :

SyntaxError: '=' expected. (2:10)
  1 | class MyComponent {
> 2 |   ngModel!: ng.INgModelController;
    |          ^
  3 | }

Mais elle est désormais prise en charge dans Prettier 1.11.0.

Prise en charge de unique symbol (#3967 par @ikatyang)​

TypeScript 2.7 a également ajouté le type unique symbol :

interface SymbolConstructor {
  readonly iterator: unique symbol;
}

Prettier 1.10.2 ne pouvait pas parser cette syntaxe :

SyntaxError: ';' expected. (2:29)
  1 | interface SymbolConstructor {
> 2 |   readonly iterator: unique symbol;
    |                             ^
  3 | }
  4 |

Mais elle est désormais prise en charge dans Prettier 1.11.0.

Prise en charge des condition types (#4006 par @Cryrivers)​

TypeScript 2.8 ajoutera les condition types, qui ressemblent à des ternaires mais apparaissent en position de type :

export type DeepReadonly<T> =
    T extends any[] ? DeepReadonlyArray<T[number]> :
    T extends object ? DeepReadonlyObject<T> :
    T;

Prettier 1.10.2 ne pouvait pas parser ces expressions :

SyntaxError: ';' expected. (2:7)
  1 | export type DeepReadonly<T> =
> 2 |     T extends any[] ? DeepReadonlyArray<T[number]> :
    |       ^
  3 |     T extends object ? DeepReadonlyObject<T> :
  4 |     T;

Mais cette syntaxe est prise en charge dans Prettier 1.11.0.

JavaScript​

Indentation incorrecte des ternaires avec --use-tabs (#3745 par @ikatyang)​

Comme les tabulations peuvent avoir différentes largeurs, Prettier indentait parfois incorrectement les ternaires lors de l'utilisation de tabulations. Nous calculons désormais l'indentation correctement :

// Before:
const abc = props.something
	? xyz
	: {
			prop1: a,
			prop2: b,
			prop3: false,
		};

// After:
const abc = props.something
	? xyz
	: {
			prop1: a,
			prop2: b,
			prop3: false
	  };

Autres changements​

CSS/SCSS/Less​

Les listes de listes ont maintenant un formatage plus propre (#3930 par @evilebottnawi)​

Nous ne gérions pas très bien les listes de listes dans SCSS. Nous les gérons désormais mieux.

// Before:
$space-scale: (0, "0") (0.25, "0-25") (0.5, "0-5") (0.75, "0-75") (1, "1")
  (
    1.25,
    "1-25"
  ) (1.5, "1-5") (1.75, "1-75") (2, "2") (2.25, "2-25") (2.5, "2-5")
  (
    2.75,
    "2-75"
  ) (3, "3") (3.25, "3-25") (3.5, "3-5") (3.75, "3-75") (4, "4");

// After:
$space-scale: (0, "0") (0.25, "0-25") (0.5, "0-5") (0.75, "0-75") (1, "1")
  (1.25, "1-25") (1.5, "1-5") (1.75, "1-75") (2, "2") (2.25, "2-25")
  (2.5, "2-5") (2.75, "2-75") (3, "3") (3.25, "3-25") (3.5, "3-5")
  (3.75, "3-75") (4, "4");

Préservation des commentaires dans les déclarations @font-face (#3906 par @evilebottnawi)​

Précédemment, si vous aviez du code comme ceci :

@font-face {
  font-family: "Prettier";
  src: local("Prettier"), /* Local */
    url("http://prettier.com/font.woff") /* Network*/
}

Alors le commentaire "Local" était supprimé par Prettier :

@font-face {
  font-family: "Prettier";
  src: local("Prettier"), url("http://prettier.com/font.woff"); /* Network*/
}

Il est désormais préservé :

@font-face {
  font-family: "Prettier";
  src: local("Prettier"), /* Local */ url("http://prettier.com/font.woff"); /* Network*/
}

L'indentation CSS n'utilise plus 3 espaces quand la ligne commence par une parenthèse (#3930 par @evilebottnawi)​

Si une ligne CSS devait être indentée et que son premier caractère était une parenthèse, elle était incorrectement indentée de 3 espaces au lieu des 2 attendus. Elle est désormais indentée de 2 espaces.

// Before:
$longVariable: (
   (mobile $mobile) (tablet $tablet) (desktop $desktop) (wide $wide)
);

// After:
$longVariable: (
  (mobile $mobile) (tablet $tablet) (desktop $desktop) (wide $wide)
);

L'espace supplémentaire n'est plus ajouté dans les maps (#3814 par @evilebottnawi)​

Prettier ajoutait par erreur des espaces dans les maps SCSS. Ils ne sont plus imprimés.

// Before:
$map: map-merge($map,  ($key: $value));

// After:
$map: map-merge($map, ($key: $value));

Les commentaires SCSS dans les listes de sélecteurs ne cassent plus le formatage (#3909 par @evilebottnawi)​

Prettier formatait incorrectement les commentaires SCSS en fin de liste de sélecteurs, ce qui cassait le code :

// Before formatting:
.field {
  &[data-field-id="1"], // Name
  &[data-field-id="2"], // Email
  &[data-field-id="3"], // Postal Code
  {
    background: green;
  }
}

// After formatting (Prettier 1.10.2):
.field {
  &[data-field-id="1"],
  // Name &[data-field-id="2"],
  // Email &[data-field-id="3"] {
    background: green;
  }
}

Prettier gère désormais correctement ces commentaires :

// After formatting (Prettier 1.11.0):
.field {
  &[data-field-id="1"], // Name
  &[data-field-id="2"], // Email
  &[data-field-id="3"], // Postal Code
 {
    background: green;
  }
}

La virgule n'est plus ajoutée après l'URL dans @import (#3770 par @evilebottnawi)​

Prettier ajoutait par erreur une virgule après les URLs dans @import. Elle n'est plus ajoutée :

/* Before */
@import url("responsive/gt768.css"), screen and (min-width: 768px);

/* After */
@import url("responsive/gt768.css") screen and (min-width: 768px);

Gestion correcte de la directive !default (#3724 par @evilebottnawi)​

Prettier imprimait la directive !default de manière étrange :

$theme-checkbox-colors: (
    default: $theme-color-border,
    checked: $theme-color-checked,
    disabled: $theme-color-disabled,
    disabled-font: $theme-color-font-secondary
  )
  !default;

Elle est désormais gérée correctement :

$theme-checkbox-colors: (
  default: $theme-color-border,
  checked: $theme-color-checked,
  disabled: $theme-color-disabled,
  disabled-font: $theme-color-font-secondary
) !default;

Ne pas formater le contenu des directives @warn et @error (#3769 par @evilebottnawi)​

SCSS permet d'afficher du texte à la compilation via @warn ou @error :

// Unformatted code:
@if ($error) {
  @error 'An error occurred: (#{$error}).';
}

Malheureusement, Prettier traitait ces directives comme des media queries, formatant leur contenu de façon inattendue (ici, un espace est ajouté avant le point) :

// Formatted code (Prettier 1.10.2):
@if ($error) {
  @error 'error (#{$error}) .';
}

Prettier gère désormais ces directives correctement et ne modifie pas le contenu des chaînes :

// Formatted code (Prettier 1.11.0):
@if ($error) {
  @error "error (#{$error}).";
}

Ne pas supprimer le point-virgule dans les déclarations de règles Less (#3841 par @evilebottnawi)​

Prettier supprimait par erreur les points-virgules après les déclarations de règles Less, nécessaires pour éviter des erreurs de compilation. Ils sont désormais conservés :

// Before:
@detached-ruleset: {
  background: red;
}

// After:
@detached-ruleset: {
  background: red;
};

Ne pas ajouter de saut de ligne dans les fichiers CSS vides (#3723 par @hudochenkov)​

Prettier ajoutait précédemment un saut de ligne en fin de fichier pour les CSS. Comme ce n'était pas le cas pour les fichiers JS, nous avons uniformisé ce comportement pour éviter des modifications inattendues dans le contrôle de source.

Ignorer les paramètres media avec interpolation SCSS (#3801 par @evilebottnawi)​

Prettier cassait par erreur le code quand une requête média contenait une interpolation SCSS. C'est désormais préservé :

// Unformatted code:
$sm-only: '(min-width: 768px) and (max-width: 991px)';
$lg-and-up: '(min-width: 1200px)';

@media screen and #{$sm-only, $lg-and-up} {
    color: #000;
}

// Formatted code (Prettier 1.10.2):
@media screen and,  {
	color: #000;
}

// Formatted code (Prettier 1.11.0):
$sm-only: "(min-width: 768px) and (max-width: 991px)";
$lg-and-up: "(min-width: 1200px)";

@media screen and #{$sm-only, $lg-and-up} {
  color: #000;
}

Ne pas imprimer deux espaces entre l'opérateur de sélecteur et le crochet ouvrant (#3738 par @evilebottnawi)​

Prettier imprimait par erreur un espace supplémentaire quand un sélecteur CSS se terminait par un opérateur (fonctionnalité supportée par SCSS). Ceci a été corrigé :

// Unformatted code:
.this > .ends > .with > .an > .operator > {
  // content
}

// Formatted code (Prettier 1.10.2):
.this > .ends > .with > .an > .operator >  {
  // content
}

// Formatted code (Prettier 1.11.0):
.this > .ends > .with > .an > .operator > {
  // content
}

Ne pas modifier la casse des noms de fonction SCSS (#3768 par @evilebottnawi)​

Prettier modifiait par erreur la casse des noms de fonction SCSS dans certains cas. Ce problème a été corrigé.

// Unformatted code:
@include breakpoint (getBp(md)) {
  &:nth-child(2n + 3) {
    clear: both;
  }
}

// Formatted code (Prettier 1.10.2):
@include breakpoint (getbp(md)) {
  &:nth-child(2n + 3) {
    clear: both;
  }
}

// Formatted code (Prettier 1.11.0):
@include breakpoint(getBp(md)) {
  &:nth-child(2n + 3) {
    clear: both;
  }
}

Conserver les espaces autour du sélecteur profond Vue >>> (#3792 par @evilebottnawi)​

Prettier supprimait par erreur les espaces autour du sélecteur profond de Vue :

<!-- Unformatted code: -->
<style scoped>
  .box >>> .child-component {
    font-size: 24px;
  }
</style>

<!-- Formatted code (Prettier 1.10.2): -->
<style scoped>
  .box>>>.child-component {
    font-size: 24px;
  }
</style>

<!-- Formatted code (Prettier 1.11.0): -->
<style scoped>
.box >>> .child-component {
  font-size: 24px;
}
</style>

Corriger la règle @nest (#3975 par @evilebottnawi)​

Prettier ajoutait par erreur des espaces autour du caractère & dans les sélecteurs passés à @nest, ce qui modifiait le sélecteur compilé. Ce problème a été corrigé :

// Unformatted code:
.title {
  @nest :global(h1)& {
    background: red;
  }
}

// Formatted code (Prettier 1.10.2):
.title {
  @nest :global(h1) & {
    background: red;
  }
}

// Formatted code (Prettier 1.11.0):
.title {
  @nest :global(h1)& {
    background: red;
  }
}

Formater progid:DXImageTransform.Microsoft.gradient tel quel (#4028 par @evilebottnawi)​

Dans Prettier 1.10.2, nous avions beaucoup de logique pour gérer le formatage des valeurs de filtre spécifiques à Microsoft, mais elles n'étaient toujours pas bien formatées. Comme elles sont non standard et peu utilisées, nous avons décidé de les imprimer telles quelles sans tenter de les formater.

Ne pas mettre en minuscules le sélecteur d'imbrication (#4048 par @evilebottnawi)​

Dans Prettier 1.10.2, nous mettions incorrectement en minuscules les sélecteurs SCSS d'imbrication :

// Unformatted code:
.foo {
  &-1Bar {
  }
}

// Formatted code: (Prettier 1.10.2):
.foo {
  &-1bar {
  }
}

Ce problème a été corrigé dans Prettier 1.11.0 :

// Formatted code: (Prettier 1.11.0):
.foo {
  &-1Bar {
  }
}

JavaScript​

Ne pas imprimer de parenthèses étranges autour de l'argument de retour avec un commentaire (#3665 par @duailibe)​

Prettier imprimait les parenthèses autour de l'argument d'une instruction return de manière étrange lorsque l'argument contenait un commentaire. Ces parenthèses sont maintenant mieux formatées.

// Unformatted code:
func1(function() {
  return func2
      //comment
      .bar();
});

// Formatted code (Prettier 1.10.2):
func1(function() {
  return (func2
      //comment
      .bar() );
});

// Formatted code (Prettier 1.11.0):
func1(function() {
  return (
    func2
      //comment
      .bar()
  );
});

Respecter le markdown-in-js sans indentation (0-indent) (#3676 par @ikatyang)​

Le formatage markdown-in-js de Prettier (déclenché par l'utilisation d'une balise de littéral modèle nommée md) ajoutait une indentation :

// Unformatted code
md`
This is some markdown
`

// Formatted code (Prettier 1.10.2)
md`
  This is some markdown
`;

Ce comportement était souhaitable et acceptable pour de nombreuses fonctions de balises de modèle markdown, comme react-markings, mais il cassait certains autres formateurs markdown internes.

Prettier 1.11.0 respectera désormais le niveau d'indentation que vous définissez dans votre markdown, afin que les utilisateurs de fonctions de balises de modèle comme celle fournie par react-markings puissent continuer à indenter leur code, et que les utilisateurs d'autres fonctions de balises de modèle qui ne prennent pas en charge l'indentation puissent choisir de ne pas le faire.

Formater les appels AMD define comme les appels CJS require (#3830 par @salemhilal)​

Lors de l'utilisation de modules AMD, un modèle consiste à utiliser define pour spécifier les dépendances d'un module anonyme, comme ceci :

define([
  "jquery",
  "common/global.context",
  "common/log.event",
  "some_project/square",
  "some_project/rectangle",
  "some_project/triangle",
  "some_project/circle",
  "some_project/star"
], function($, Context, EventLogger, Square, Rectangle, Triangle, Circle, Star) {
  console.log("some code");
});

Prettier 1.10.2 répartissait cela sur plusieurs lignes, ce qui introduisait beaucoup d'indentation de premier niveau :

define(
  [
    "jquery",
    "common/global.context",
    "common/log.event",
    "some_project/square",
    "some_project/rectangle",
    "some_project/triangle",
    "some_project/circle",
    "some_project/star"
  ],
  function($, Context, EventLogger, Square, Rectangle, Triangle, Circle, Star) {
    console.log("some code");
  }
);

Prettier 1.11.0 fera désormais en sorte que le tableau et l'expression fonction se "serrent", ce qui réduit le niveau d'indentation :

define([
  "jquery",
  "common/global.context",
  "common/log.event",
  "some_project/square",
  "some_project/rectangle",
  "some_project/triangle",
  "some_project/circle",
  "some_project/star"
], function(
  $,
  Context,
  EventLogger,
  Square,
  Rectangle,
  Triangle,
  Circle,
  Star
) {
  console.log("some code");
});

Formater skip de QUnit comme test (#3735 par @tmquinn)​

Prettier avait des cas spéciaux de formatage pour describe, it et test afin d'améliorer le formatage dans les tests en fonction des attentes et des demandes des utilisateurs. Cependant, nous ne formattions pas la méthode skip de QUnit avec la même logique, ce qui entraînait un formatage mixte lors du passage d'un test entre test et skip :

// Unformatted code
test("this is a really long description of some test I want to go here", function (assert) {
  assert("something");
});

skip("this is a really long description of some test I want to go here", function (assert) {
  assert("something");
});

// Formatted code (Prettier 1.10.2):
test("this is a really long description of some test I want to go here", function(assert) {
  assert("something");
});

skip(
  "this is a really long description of some test I want to go here",
  function(assert) {
    assert("something");
  }
);

Nous traitons désormais skip de la même manière que describe, it et test, ce qui rend les tests QUnit plus uniformes :

// Formatted code (Prettier 1.11.0):
test("this is a really long description of some test I want to go here", function(assert) {
  assert("something");
});

skip("this is a really long description of some test I want to go here", function(assert) {
  assert("something");
});

Sauter l'élément JSX si une propriété de chaîne littérale contient un saut de ligne (#4011 par @duailibe)​

Selon la spécification JSX, les caractères de nouvelle ligne sont autorisés dans les littéraux de chaîne JSX. Cependant, Prettier ne traitait pas un élément JSX comme multiligne lorsque l'une de ses valeurs d'attribut était une chaîne contenant un saut de ligne. Désormais, Prettier traitera correctement ces éléments comme multilignes :

// Unformatted code:
<path d="M4.765 16.829l3.069-2.946 5.813 5.748
  11.33-11.232 3.006 3.18-14.36 14.080z"
/>;

// Formatted code (Prettier 1.10.2):
<path d="M4.765 16.829l3.069-2.946 5.813 5.748
  11.33-11.232 3.006 3.18-14.36 14.080z" />;

// Formatted code (Prettier 1.11.0):
<path
  d="M4.765 16.829l3.069-2.946 5.813 5.748
  11.33-11.232 3.006 3.18-14.36 14.080z"
/>;

Prise en charge du spread pour les enfants JSX avec le parser Flow (#3899 par @vjeux)​

L'utilisation d'un opérateur spread dans un conteneur d'expression enfant JSX provoquait une erreur d'analyse dans Prettier 1.10.2 avec le parser Flow :

<JSX>
  {...edges}
</JSX>
SyntaxError: Unexpected token ... (2:4)
  1 | <JSX>
> 2 |   {...edges}
    |    ^^^
  3 | </JSX>

Dans Prettier 1.11.0, cette syntaxe est prise en charge avec le parser Flow.

Correction d'une erreur lors de l'impression des types de retour d'objet optionnels en Flow (#3948 par @azz)​

Dans Prettier 1.10.2, ce code provoquait une erreur :

function getScaledData({x}): ?{foo: number} {}

Ce problème a été corrigé dans Prettier 1.11.0.

--insert-pragma ne supprime plus les pragmas en double (#3947 par @azz)​

L'option --insert-pragma supprimait tous les pragmas en double sauf un. Ce comportement a été corrigé :

// Unformatted code:
/**
 * @x 1
 * @x 2
 */

// Formatted code (Prettier 1.10.2):
/**
 * @format
 * @x 2
 */

// Formatted code (Prettier 1.11.0):
/**
 * @format
 * @x 1
 * @x 2
 */

Parenthésage des ternaires avec cast de type Flow (#3940 par @j-f1)​

Pour améliorer la clarté du code, les ternaires avec conversion de type sont désormais entourés de parenthèses :

// Unformatted code:
const foo = ((1?2:3): number);

// Formatted code (Prettier 1.10.2):
const foo = (1 ? 2 : 3: number);

// Formatted code (Prettier 1.11.0):
const foo = ((1 ? 2 : 3): number);

Correction des points-virgules manquants dans DeclareExportDeclaration (#3979 par @existentialism)​

Les points-virgules étaient incorrectement supprimés des déclarations declare export default dans les fichiers de définition de bibliothèque Flow. Ce problème est résolu.

TypeScript​

Conservation des parenthèses pour (void 0)! (#3989 par @azz)​

Prettier supprimait incorrectement les parenthèses de (void 0)!, altérant l'AST du programme. Ce problème est corrigé.

Chaînage correct avec TSNonNullExpression (#4005 par @ericanderson)​

Prettier n'appliquait pas son formatage de chaînage lorsque la chaîne incluait une expression TypeScript ! de non-nullité. Ce problème est résolu :

// Unformatted code:
this.tokenLoads.get(locator).get(start).push({});

this.tokenLoads.get(locator)!.get(start).push({});

// Formatted code (Prettier 1.10.2):
this.tokenLoads
  .get(locator)
  .get(start)
  .push({});

this.tokenLoads.get(locator)!.get(start).push({});

// Formatted code (Prettier 1.11.0):
this.tokenLoads
  .get(locator)
  .get(start)
  .push({});

this.tokenLoads
  .get(locator)!
  .get(start)
  .push({});

Markdown​

Fusion incorrecte d'un titre après un élément de liste (#3780 par @ikatyang)​

Prettier fusionnait par erreur un titre situé sous un élément de liste dans la liste. Il est maintenant correctement traité comme un titre :

<!-- Unformatted code -->
* Something
### Some heading

<!-- Formatted code (Prettier 1.10.2) -->
* Something
  ### Some heading

<!-- Formatted code (Prettier 1.11.0) -->
* Something

### Some heading

Préservation des entités HTML dans les URLs de liens (#3780 par @ikatyang)​

Les liens dont l'URL contenait des entités HTML étaient modifiés incorrectement par Prettier. Ils sont désormais préservés.

<!-- Unformatted code -->
[Test](http://localhost:8080/test?language=DE&currency=EUR)

<!-- Formatted code (Prettier 1.10.2) -->
[Test](http://localhost:8080/test?language=DE¤cy=EUR)

<!-- Formatted code (Prettier 1.11.0) -->
[Test](http://localhost:8080/test?language=DE&currency=EUR)

Correction de l'indentation des templates strings dans les blocs de code (#3676 par @ikatyang)​

L'indentation du contenu des templates strings dans les blocs de code Markdown était incorrectement calculée :

<!-- Unformatted code: -->
- 1
  - 2
    - 3
      ```js
      something`
      asd

      asd

      asd
      `
      ```

<!-- Formatted code (Prettier 1.10.2): -->
* 1

  * 2

    * 3

      ```js
      something`
asd

asd

asd
`;
      ```

Ce problème est résolu dans Prettier 1.11.0 :

<!-- Formatted code (Prettier 1.11.0): -->
* 1

  * 2

    * 3

      ```js
      something`
      asd

      asd

      asd
      `;
      ```

Impression correcte du contenu multiligne dans footnoteDefinition (#3787 par @ikatyang)​

Prettier utilisait un niveau d'indentation incorrect pour les notes de bas de page contenant des blocs de code. Ce problème est corrigé :

<!-- Unformatted code: -->
Some text.[^fn]

[^fn]: Here is a footnote which includes code.

    ```rs
    fn main() {
        println!("this is some Rust!");
    }
    ```

<!-- Formatted code (Prettier 1.10.2): -->
Some text.[^fn]

[^fn]: Here is a footnote which includes code.

```rs
fn main() {
    println!("this is some Rust!");
}
```

<!-- Formatted code (Prettier 1.11.0): -->

Some text.[^fn]

[^fn]: Here is a footnote which includes code.

```rs
fn main() {
    println!("this is some Rust!");
}
```

Respect de tabWidth pour les éléments de liste (#3990 par @ikatyang)​

Nous avons constaté que CommonMark diverge de la syntaxe Markdown originale pour les blocs de code dans les listes. Cela entraînait des situations où les blocs de code indentés étaient rendus comme des paragraphes normaux. Cette modification utilise l'option tabWidth pour déterminer l'indentation des éléments de liste. Consultez #3459 pour plus de détails.

<!-- before -->
1. Change to your home directory:

   cd

<!-- after -->
1. Change to your home directory:

        cd

Ce changement améliore également l'indentation dans les éditeurs de texte :

API​

Prise en charge des options dans les plugins (#3775 par @ikatyang)​

Dans le cadre de l'enrichissement de notre API de plugins bêta pour les langages créés par la communauté, nous avons ajouté la possibilité pour les plugins de définir leurs propres options !

Les options des plugins peuvent désormais être affichées dans l'aide :

prettier --plugin @prettier/plugin-python --help

De même, les options des plugins peuvent être spécifiées en ligne de commande :

prettier --plugin my-cool-prettier-plugin --my-custom-option

Et les options des plugins peuvent également être définies dans .prettierrc :

{ "plugins": ["foo-plugin"], "fooOption": "bar" }

Interdiction des options en kebab-case dans les fichiers de configuration (#3622 par @ikatyang)​

Prettier autorisait par erreur les variantes kebab-case des options dans les fichiers .prettierrc :

{ "print-width": 100 }

Ce comportement n'était pas intentionnel et a été annulé (dans ce cas, vous devez utiliser printWidth).

Configuration​

Respect d'EditorConfig lorsque --config est fourni (#3992 par @josephfrazier)​

Il s'agit d'un changement mineur dans le traitement des fichiers .editorconfig. Auparavant, lorsque --config était fourni, .editorconfig était ignoré.

Merci à tous les contributeurs de Prettier et à la communauté pour avoir fait de Prettier un projet open-source réussi et productif ! Nous n'y serions pas parvenus sans vous tous ❤️