Hoppa till huvudinnehållet

Prettier 1.11: CSS-fixar och stöd för nya TypeScript-funktioner

· 19 min att läsa
Lily Skye
Lily Skye
Inofficiell Beta-översättning

Denna sida har översatts av PageTurner AI (beta). Inte officiellt godkänd av projektet. Hittade du ett fel? Rapportera problem →

Den här versionen innehåller massor av CSS-formateringsfixar samt stöd för nya TypeScript-funktioner, plus allmänna buggfixar för andra språk.

Sedan föregående release har Prettiers webbplats fått ett helt nytt design tack vare @orta!

Facebook är 💯% Prettier​

En annan spännande nyhet är att alla JavaScript-filer i Facebooks kodbas nu har konverterats till Prettier! Det fantastiska är att det inte funnits någon organiserad kampanj för att konvertera kodbasen - vi lade bara till verktygen och dokumentation om hur man migrerar en mapp till Prettier, och sedan började folk konvertera sina delar av kodbasen på eget initiativ.

På 8 månader konverterades 75% av kodbasen organiskt, och förra veckan gjorde vi en final push för att konvertera resten och se till att alla filer hädanefter använder Prettier! Det visar att Prettier är robust nog att hantera alla galna edge cases man kan tänka sig, och att den ger så pass mycket värde eftersom adoptionsgraden varit så hög.

Höjdpunkter​

CSS/SCSS/Less​

Vår CSS-formatering fick mycket kärlek från @evilebottnawi i den här releasen!

Formatera at-regler (#3828 av @evilebottnawi)​

Tidigare formaterades vissa at-regler (som @if och @include) inte av Prettier utan skrevs ut som de var. Nu formateras de:

// 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
  );
}

Stöd för populära PostCSS-plugins (#3959 av @evilebottnawi)​

Vissa populära PostCSS-plugins som postcss-mixins fungerade inte på grund av hur Prettier formaterade CSS. Dessa plugins respekteras nu:

// Before
$theme: blue;

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

// After
$theme: blue;

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

Stöd för YAML front-matter-block i SCSS (#3802 av @evilebottnawi)​

Jekyll förlitar sig på YAML front-matter för att identifiera SCSS-filer, men Prettier tog bort det, vilket kunde krascha Jekyll-sidor vid deployment. YAML front-matter bevaras nu, vilket säkerställer att styling bevaras:

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

a {
  color: red;
}

TypeScript​

Stöd för definite assignment (!:) (#4020 av @ikatyang)​

TypeScript 2.7 lade till en ny funktion kallad definite assignment som kan användas i klassproperties initializerare. Den informerar TypeScript att även om en klassegenskap inte har en initierare, kan vi vara säkra på att den vid runtime har ett värde istället för undefined:

class MyComponent {
  ngModel!: ng.INgModelController;
}

Prettier 1.10.2 kunde inte tolka den här syntaxen:

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

Men den stöds nu i Prettier 1.11.0.

Stöd för unique symbol (#3967 av @ikatyang)​

TypeScript 2.7 lade också till en ny unique symbol-typ:

interface SymbolConstructor {
  readonly iterator: unique symbol;
}

Prettier 1.10.2 kunde inte tolka den här syntaxen:

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

Men den stöds nu i Prettier 1.11.0.

Stöd för villkorstyper (#4006 av @Cryrivers)​

TypeScript 2.8 kommer lägga till stöd för villkorstyper, som ser ut som ternaries men förekommer i en type-position:

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

Prettier 1.10.2 kunde inte tolka dessa:

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

Men den här syntaxen stöds nu i Prettier 1.11.0.

JavaScript​

Ternaries indenterades felaktigt med --use-tabs (#3745 av @ikatyang)​

Eftersom tabbar kan representeras med olika bredder, indenterade Prettier ibland ternaries felaktigt när tabbar användes. Nu beräknar vi indenteringen korrekt:

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

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

Andra ändringar​

CSS/SCSS/Less​

Listor av listor har nu renare formatering (#3930 by @evilebottnawi)​

Vi hanterade inte listor av listor särskilt bra i SCSS tidigare. Nu hanterar vi dem bättre.

// 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");

Bevara kommentarer i font-face-deklarationer (#3906 by @evilebottnawi)​

Tidigare, om du hade kod så här:

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

Då togs kommentaren "Local" bort av Prettier:

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

Den bevaras nu:

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

CSS-indrag använder inte längre 3 mellanslag när raden börjar med parentes (#3930 by @evilebottnawi)​

Om en CSS-rad skulle ha indrag och första tecknet på raden var en parentes, indrog Prettier felaktigt med 3 mellanslag istället för förväntade 2. Nu används 2 mellanslag.

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

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

Extra mellanslag läggs inte längre till inuti maps (#3814 by @evilebottnawi)​

Prettier lade tidigare till mellanslag inuti SCSS-maps felaktigt. Dessa finns inte längre med i utskriften.

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

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

SCSS-kommentarer i selektorlistor bryter inte längre formateringen (#3909 by @evilebottnawi)​

Prettier formaterade avslutande SCSS-kommentarer i CSS-selektorlistor felaktigt, vilket bröt koden:

// 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 hanterar nu dessa kommentarer korrekt:

// 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;
  }
}

Komma läggs inte längre till efter @import-url (#3770 by @evilebottnawi)​

Prettier lade tidigare till ett kommatecken efter @import-urls felaktigt. Detta läggs inte längre till:

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

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

Hantera !default-direktivet korrekt (#3724 by @evilebottnawi)​

Prettier skrev ut !default-direktivet på ett konstigt sätt:

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

Nu hanteras det korrekt:

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

Formatera inte innehållet i @warn och @error-direktiv (#3769 by @evilebottnawi)​

SCSS har en funktion som låter dig skriva ut text vid byggtid med @warn eller @error:

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

Tyvärr behandlade Prettier dessa direktiv som media queries och formaterade deras innehåll på oväntade sätt (i detta exempel läggs ett mellanslag till före punkten):

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

Prettier hanterar nu dessa direktiv korrekt och kommer inte ändra strängens innehåll:

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

Ta inte bort semikolon i Less ruleset-deklarationer (#3841 by @evilebottnawi)​

Prettier tog tidigare bort semikolon efter Less ruleset-deklarationer felaktigt, vilket behövdes kvar för att undvika kompileringsfel. Dessa bevaras nu:

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

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

Lägg inte till ny rad i tom CSS-fil (#3723 by @hudochenkov)​

Prettier lade tidigare till en radbrytning i slutet av CSS-filer. Vi gjorde inte detta för JS-filer, så vi beslutade att göra detta konsekvent för CSS för att undvika oväntade ändringar i källkontroll vid införande av Prettier.

Ignorera media-parametrar med SCSS-interpolering (#3801 by @evilebottnawi)​

Prettier bröt tidigare koden felaktigt när en media query innehöll SCSS-interpolering. Den bevaras nu:

// 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;
}

Skriv inte ut två mellanslag mellan selektoroperator och inledande klammer (#3738 by @evilebottnawi)​

Prettier skrev tidigare ut ett extra mellanslag när en CSS-selektor slutade med en operator (en funktion som stöds av SCSS). Detta har åtgärdats:

// 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
}

Ändra inte versalisering av SCSS-funktionsnamn (#3768 by @evilebottnawi)​

Prettier gjorde tidigare felaktigt SCSS-funktionsnamn till gemener i vissa fall. Detta har åtgärdats.

// 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;
  }
}

Behåll mellanslag runt Vue:s djupväljare >>> (#3792 av @evilebottnawi)​

Prettier tog tidigare bort mellanslag runt Vue:s djupväljare:

<!-- 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>

Åtgärda @nest-at-regeln (#3975 av @evilebottnawi)​

Prettier lade tidigare till mellanslag runt &-tecknet i selektorer som skickades till @nest, vilket ändrade vilken selektor regeln kompilerades till. Detta har åtgärdats:

// 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;
  }
}

Formatera progid:DXImageTransform.Microsoft.gradient som den är (#4028 av @evilebottnawi)​

I Prettier 1.10.2 fanns mycket logik för att hantera formatering av Microsoft-specifika filtervärden, men de formaterades ändå inte optimalt. Eftersom de är icke-standardiserade och sällan använda kommer vi nu att skriva ut dem oformaterade.

Använd inte gemener för nästade selektorer (#4048 av @evilebottnawi)​

I Prettier 1.10.2 gjordes nästade SCSS-selektorer felaktigt till gemener:

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

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

Detta har åtgärdats i Prettier 1.11.0:

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

JavaScript​

Undvik konstiga parenteser runt returargument med kommentar (#3665 av @duailibe)​

Prettier placerade parenteser runt return-argument på ett konstigt sätt när argumentet innehöll kommentar. Dessa parenteser formateras nu korrekt.

// 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()
  );
});

Respektera noll-indentering för markdown-i-js (#3676 av @ikatyang)​

Prettiers markdown-i-js-formatering (aktiverad via malliteraltagg md) lade tidigare till indrag:

// Unformatted code
md`
This is some markdown
`

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

Detta var önskvärt för många markdown-taggar som react-markings, men bröt vissa interna formaterare.

Prettier 1.11.0 respekterar nu din valda indentering, så användare av taggar som react-markings kan fortsätta indentera medan andra kan välja att inte göra det.

Formatera AMD-define-anrop som CJS-require-anrop (#3830 av @salemhilal)​

Vid användning av AMD-moduler är ett vanligt mönster att använda define för beroenden i anonyma moduler:

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 bröt upp detta på flera rader med hög toppnivå-indentering:

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 "kramar" nu arrayen och funktionsuttrycket för minskad indentering:

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");
});

Formatera QUnits skip som test (#3735 av @tmquinn)​

Prettier hade specialformatering för describe, it och test för att förbättra formateringen i tester baserat på användarnas förväntningar och önskemål. Däremot formaterade vi inte QUnits skip-metod med samma logik, vilket ledde till blandad formatering när man byter ett test mellan test och 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");
  }
);

Vi behandlar nu skip likadant som describe, it och test för enhetlig QUnit-formatering:

// 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");
});

Bryt JSX-element vid nyrad i strängliteral-attribut (#4011 av @duailibe)​

Enligt JSX-specifikationen tillåts nyrader i strängliteral-attribut, men Prettier behandlade inte element som flerradiga i dessa fall. Detta åtgärdas nu:

// 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"
/>;

Stöd för spridning av JSX-barn med flow-parser (#3899 av @vjeux)​

Att använda en spread-operator i en JSX children expression container-position orsakade ett parsningsfel i Prettier 1.10.2 när flow-parsern användes:

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

I Prettier 1.11.0 stöds denna syntax med flow-parsern.

Åtgärda fel vid utskrift av flow maybe object-returtyp (#3948 by @azz)​

I Prettier 1.10.2 orsakade denna kod att ett fel kastades:

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

Detta har åtgärdats i Prettier 1.11.0.

--insert-pragma tar inte längre bort duplicerade pragman (#3947 by @azz)​

Att använda --insert-pragma på kod med duplicerade pragman tog tidigare bort alla utom en av dupliceringarna. Detta har åtgärdats:

// 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
 */

Omsluta flow-typomvandlade ternärer med parenteser (#3940 by @j-f1)​

För att förbättra kodklarheten kommer typomvandlade ternärer nu att omslutas med parenteser:

// 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);

Åtgärda fall med saknat semikolon vid utskrift av DeclareExportDeclaration (#3979 by @existentialism)​

Semikolon togs felaktigt bort från declare export default-uttryck i flow-biblioteksdefinitionsfiler. Detta har åtgärdats.

TypeScript​

Ta inte bort parenteser från (void 0)! (#3989 by @azz)​

Prettier tog felaktigt bort parenteser från (void 0)!, vilket ändrade programmets AST. Detta har åtgärdats.

Kedja korrekt när det finns ett TSNonNullExpression (#4005 by @ericanderson)​

Prettier använde inte sin kedjeformateringsstil när kedjan inkluderade ett TypeScript ! non-null-uttryck. Detta har åtgärdats:

// 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​

Rubrik efter listobjekt slås samman med listan (#3780 by @ikatyang)​

Prettier sammanfogade felaktigt en rubrik under ett listobjekt med listan. Nu behandlas den som en rubrik:

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

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

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

### Some heading

Tolka inte HTML-entiteter i länk-URL:er (#3780 by @ikatyang)​

Länkar vars URL innehöll HTML-entiteter ändrades felaktigt när de kördes genom Prettier. De bevaras nu.

<!-- 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)

Åtgärda indrag av mallsträngar i kodeblock (#3676 by @ikatyang)​

Indraget av JS-taggade mallsträngsinnehåll i markdown-kodeblock beräknades felaktigt:

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

      asd

      asd
      `
      ```

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

  * 2

    * 3

      ```js
      something`
asd

asd

asd
`;
      ```

Detta har åtgärdats i Prettier 1.11.0:

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

  * 2

    * 3

      ```js
      something`
      asd

      asd

      asd
      `;
      ```

Skriv ut flerradigt innehåll korrekt i footnoteDefinition (#3787 by @ikatyang)​

Prettier använde felaktigt fel indragsnivå när en fotnot som innehöll ett kodeblock skrevs ut. Detta har åtgärdats:

<!-- 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!");
}
```

Respektera tabWidth för listobjekt (#3990 by @ikatyang)​

Vi har upptäckt att CommonMark avviker från den ursprungliga Markdown-syntaxen för kodeblock i listobjekt. Detta leder till scenarier där indragna kodeblock i Markdown renderades som vanliga stycken. Denna ändring använder alternativet tabWidth för att bestämma hur mycket indrag som ska användas i listobjekt. Läs igenom #3459 om du är intresserad av detaljerna.

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

   cd

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

        cd

Denna ändring bör också förbättra indraget i textredigerare:

API​

Stöd för alternativ i pluginmoduler (#3775 by @ikatyang)​

Som en del av att utveckla vårt beta-plugin-API för community-skapade språkpluginmoduler har vi lagt till stöd för att pluginmoduler ska kunna definiera sina egna alternativ!

Pluginmodulernas alternativ kan nu skrivas ut i hjälptexten:

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

På samma sätt kan pluginmodulernas alternativ angivas på kommandoraden:

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

Och plugin-alternativ kan också definieras i .prettierrc:

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

Tillåt inte kebab-case-alternativ i konfigurationsfiler (#3622 av @ikatyang)​

Prettier tillät av misstag kebab-case-varianter av alternativ i .prettierrc-filer:

{ "print-width": 100 }

Detta var inte avsett att tillåtas, och har återställts (i det här fallet måste du använda printWidth).

Konfiguration​

Respektera EditorConfig när --config anges (#3992 av @josephfrazier)​

Detta är en mindre ändring i hur .editorconfig-filer hanteras. Tidigare ignorerades .editorconfig när --config angavs.

Tack till alla Prettiers bidragsgivare och communityn för att ni gjort Prettier till ett framgångsrikt och produktivt öppen källkod-projekt! Vi kunde inte ha gjort det utan er alla ❤️