メインコンテンツへスキップ

Prettier 1.11: CSSの修正と新しいTypeScript機能のサポート

· 1分で読める
Lily Skye
Lily Skye
非公式ベータ版翻訳

このページは PageTurner AI で翻訳されました（ベータ版）。プロジェクト公式の承認はありません。 エラーを見つけましたか？ 問題を報告 →

このリリースでは、CSSフォーマットの大幅な修正に加え、いくつかの新しいTypeScript機能のサポート、およびその他の言語向けの一般的なバグ修正が行われました。

前回のリリース以降、@ortaの貢献によりPrettierウェブサイトが全面的にリデザインされました！

Facebook は 💯% Prettier に​

さらに嬉しいニュースとして、Facebookのコードベース内のJavaScriptファイルがすべてPrettierに移行されました！驚くべきは、コードベース全体をPrettierに移行するための集中的な取り組みがなかったことです。単にツールを導入し、フォルダ単位での移行方法をドキュメント化したところ、各チームが自発的に担当部分を変換し始めたのです。

8ヶ月でコードベースの75%が自然に移行され、先週は残りを一気に変換し、今後はすべてのファイルでPrettierの使用を義務付けました！これはPrettierが想像しうるあらゆる特殊なケースをサポートする堅牢性と、驚異的な導入率が示すように大きな価値を提供している証です。

主な変更点​

CSS/SCSS/Less​

今回のリリースでは@evilebottnawiによるCSSフォーマットへの多大な貢献がありました！

@ルールのフォーマット (#3828 by @evilebottnawi)​

これまで@ifや@includeなどの一部の@ルールはPrettierでフォーマットされず、そのまま出力されていました。これらが新たにフォーマット対象となりました：

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

主要なPostCSSプラグインのサポート (#3959 by @evilebottnawi)​

postcss-mixinsのような主要なPostCSSプラグインは、PrettierのCSSフォーマット方法が原因で動作していませんでした。これらのプラグインが適切に扱われるようになりました：

// Before
$theme: blue;

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

// After
$theme: blue;

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

SCSSでのYAML front-matterブロック対応 (#3802 by @evilebottnawi)​

JekyllはSCSSファイルを検出するためにYAML front-matterに依存していますが、Prettierがこれを削除していたため、デプロイ時にJekyllサイトが壊れる問題がありました。YAML front-matterが保持されるようになり、スタイリングが維持されます：

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

a {
  color: red;
}

TypeScript​

definite assignment (!:) のサポート (#4020 by @ikatyang)​

TypeScript 2.7で追加されたdefinite assignment機能は、クラスプロパティ初期化子で使用できます。この機能は、クラスプロパティに初期化子がなくても、実行時にundefinedではなく値が確実に存在することをTypeScriptに伝えます：

class MyComponent {
  ngModel!: ng.INgModelController;
}

Prettier 1.10.2ではこの構文をパースできませんでした：

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

Prettier 1.11.0でサポートされました。

unique symbol のサポート (#3967 by @ikatyang)​

TypeScript 2.7では新たにunique symbol型が追加されました：

interface SymbolConstructor {
  readonly iterator: unique symbol;
}

Prettier 1.10.2ではこの構文をパースできませんでした：

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

Prettier 1.11.0でサポートされました。

条件型のサポート (#4006 by @Cryrivers)​

TypeScript 2.8で追加される条件型は、型位置に出現する三項演算子のような構文です：

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

Prettier 1.10.2ではこれらをパースできませんでした：

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

Prettier 1.11.0でこの構文がサポートされました。

JavaScript​

--use-tabs使用時の三項演算子インデント不具合 (#3745 by @ikatyang)​

タブ文字は幅が可変であるため、タブ使用時に三項演算子のインデントが不正確になるケースがありました。インデント計算が適切に行われるようになりました：

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

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

その他の変更​

CSS/SCSS/Less​

リストのリストのフォーマットが改善されました (#3930 by @evilebottnawi)​

SCSSでのリストのリストの扱いが不十分でしたが、今回改善されました。

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

font-face宣言内のコメントが保持されるようになりました (#3906 by @evilebottnawi)​

以前は次のようなコードがある場合：

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

"Local"というコメントがPrettierによって削除されていました：

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

現在は保持されます：

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

行頭が括弧で始まるCSSのインデントが3スペースから修正されました (#3930 by @evilebottnawi)​

CSSの行をインデントする際、行頭文字が括弧の場合、誤って3スペースでインデントされていました（想定は2スペース）。現在は2スペースでインデントされます。

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

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

マップ内の余分なスペースが追加されなくなりました (#3814 by @evilebottnawi)​

PrettierがSCSSマップ内に誤ってスペースを追加していましたが、これらは出力されなくなりました。

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

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

セレクターリスト内のSCSSコメントでフォーマットが壊れなくなりました (#3909 by @evilebottnawi)​

PrettierはCSSセレクターリスト内の末尾SCSSコメントを誤ってフォーマットし、コードを壊していました：

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

現在はこれらのコメントを正しく処理します：

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

@import urlの後にカンマが追加されなくなりました (#3770 by @evilebottnawi)​

Prettierが誤って@import urlの後にカンマを追加していましたが、これは出力されなくなりました：

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

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

!defaultディレクティブの扱いが適切になりました (#3724 by @evilebottnawi)​

Prettierは!defaultディレクティブを不自然な方法で出力していました：

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

現在は適切に処理されます：

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

@warnおよび@errorディレクティブの内容をフォーマットしなくなりました (#3769 by @evilebottnawi)​

SCSSには@warnや@errorを使用してビルド時にテキストを出力する機能があります：

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

残念ながらPrettierはこれらのディレクティブをメディアクエリと見なして、内容を予期しない方法でフォーマットしていました（この例ではピリオドの前にスペースが追加されています）：

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

現在はこれらのディレクティブを正しく処理し、文字列の内容を変更しません：

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

Lessルールセット宣言のセミコロンが削除されなくなりました (#3841 by @evilebottnawi)​

Prettierは誤ってLessルールセット宣言後のセミコロンを削除していましたが、これらは保持される必要があり（削除するとコンパイルエラーが発生）、現在は保持されます：

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

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

空のCSSファイルに改行が追加されなくなりました (#3723 by @hudochenkov)​

以前PrettierはCSSファイルの終端に改行を追加していました。JSファイルではこの動作を行っていなかったため、プロジェクトにPrettierを追加した際のソース管理上の予期せぬ変更を避けるため、CSSでもこの動作を一貫させることにしました。

SCSS補間を含むmediaパラメータを無視するようになりました (#3801 by @evilebottnawi)​

メディアクエリにSCSS補間が含まれている場合、Prettierは誤ってコードを壊していました。現在は保持されます：

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

セレクター演算子と開き括弧の間に2スペースが出力されなくなりました (#3738 by @evilebottnawi)​

CSSセレクターが演算子で終わる場合（SCSSでサポートされている機能）、Prettierは誤って余分なスペースを出力していました。これが修正されました：

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

SCSS関数名の大文字小文字を変更しなくなりました (#3768 by @evilebottnawi)​

Prettierは特定の場合にSCSS関数名を誤って小文字化していました。この問題は修正されました。

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

Vueのディープセレクタ >>> 周囲のスペースを維持 (#3792 by @evilebottnawi)​

Prettierは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>

@nest アットルールの修正 (#3975 by @evilebottnawi)​

Prettierは@nestに渡されるセレクタ内の&文字周囲に誤ってスペースを追加しており、ルールのコンパイル対象セレクタを変更していました。この問題は修正されました：

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

progid:DXImageTransform.Microsoft.gradient をそのままの形式でフォーマット (#4028 by @evilebottnawi)​

Prettier 1.10.2ではMicrosoftブラウザ固有のフィルター値フォーマット処理に多くのロジックを実装していましたが、十分なフォーマット結果が得られませんでした。これらは非標準で使用頻度が低いため、フォーマットせずにそのまま出力するように変更しました。

ネストセレクタを小文字化しない (#4048 by @evilebottnawi)​

Prettier 1.10.2ではネストされたSCSSセレクタを誤って小文字化していました：

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

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

この問題はPrettier 1.11.0で修正されました：

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

JavaScript​

コメント付きreturn引数周囲に不自然な括弧を出力しない (#3665 by @duailibe)​

Prettierは引数にコメントが含まれる場合、return文の引数周囲に不自然な括弧を出力していました。これらの括弧はより適切にフォーマットされるようになりました。

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

0インデントのJS内Markdownを尊重 (#3676 by @ikatyang)​

PrettierのJS内Markdownフォーマット（mdというテンプレートリテラルタグ使用時に発動）はインデントを挿入していました：

// Unformatted code
md`
This is some markdown
`

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

この動作はreact-markingsなどの多くのMarkdownテンプレートタグ関数では望ましいものでしたが、社内製Markdownフォーマッタの動作を妨げるケースがありました。

Prettier 1.11.0ではMarkdown内で設定したインデントレベルを尊重するため、react-markingsのようなテンプレートタグ関数ユーザーは従来通りインデントを維持でき、インデントをサポートしない他の関数ユーザーはインデントしない選択が可能です。

AMD define呼び出しをCJS require呼び出しと同様にフォーマット (#3830 by @salemhilal)​

AMDモジュール使用時、匿名モジュールの依存関係を指定するdefineの使用パターンがあります：

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ではこれを複数行に分割し、過剰なトップレベルインデントが発生していました：

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では配列と関数式を「密着」させてフォーマットするため、インデントレベルが減少します：

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

QUnitのskipをtestと同様にフォーマット (#3735 by @tmquinn)​

Prettierはユーザー期待に応えるためdescribe、it、testのフォーマットを特別扱いしていましたが、QUnitのskipメソッドには同様のロジックを適用しておらず、testと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");
  }
);

現在はskipをdescribe、it、testと同様に扱うため、QUnitテストの見た目が統一されます：

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

文字列リテラルプロパティに改行がある場合のJSX要素改行 (#4011 by @duailibe)​

JSX仕様では文字列リテラル内の改行が許可されていますが、Prettierは改行を含む属性値を持つJSX要素を複数行として扱っていませんでした。今後は期待通り複数行として扱います：

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

FlowパーサーでのJSX子要素スプレッドのサポート (#3899 by @vjeux)​

JSXの子要素式コンテナ位置でスプレッド演算子を使用すると、Prettier 1.10.2でflowパーサー使用時にパースエラーが発生していました:

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

Prettier 1.11.0では、flowパーサーでこの構文がサポートされました。

Flowのオブジェクト返り型のMaybe修飾子付き型注釈の出力エラーを修正 (#3948 by @azz)​

Prettier 1.10.2では、このコードがエラーを引き起こしていました:

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

Prettier 1.11.0で修正されました。

--insert-pragmaが重複プラグマを削除しなくなりました (#3947 by @azz)​

重複プラグマを含むコードで--insert-pragmaを使用すると、重複分が1つを除き削除されていました。この問題が修正されました:

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

Flow型キャスト付き三項演算子を括弧で囲むように変更 (#3940 by @j-f1)​

コードの明確性向上のため、型キャスト付き三項演算子を括弧で囲むよう変更されました:

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

DeclareExportDeclaration出力時のセミコロン欠落ケースを修正 (#3979 by @existentialism)​

Flowライブラリ定義ファイルにおけるdeclare export default文からセミコロンが誤って削除される問題が修正されました。

TypeScript​

(void 0)!の括弧を削除しないように変更 (#3989 by @azz)​

Prettierが誤って(void 0)!の括弧を削除し、プログラムのASTを変更していた問題が修正されました。

TSNonNullExpressionを含む場合の適切なチェーン処理を実装 (#4005 by @ericanderson)​

チェーンにTypeScriptの!非null式が含まれる場合、Prettierがチェーン形式のフォーマットを適用していなかった問題が修正されました:

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

リスト項目後の見出しがリストに統合される問題を修正 (#3780 by @ikatyang)​

リスト項目直後の見出しが誤ってリストに統合されていた問題が修正され、見出しとして正しく扱われるようになりました:

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

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

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

### Some heading

リンクURL内のHTMLエンティティをパースしないように変更 (#3780 by @ikatyang)​

URLにHTMLエンティティを含むリンクがPrettier処理時に誤って変更される問題が修正され、元の形式が保持されるようになりました。

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

コードブロック内テンプレート文字列のインデントを修正 (#3676 by @ikatyang)​

Markdownコードブロック内のJSタグ付きテンプレート文字列のインデントが誤って計算されていました:

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

      asd

      asd
      `
      ```

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

  * 2

    * 3

      ```js
      something`
asd

asd

asd
`;
      ```

Prettier 1.11.0で修正されました:

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

  * 2

    * 3

      ```js
      something`
      asd

      asd

      asd
      `;
      ```

footnoteDefinition内の複数行コンテンツを正しく出力 (#3787 by @ikatyang)​

コードブロックを含む脚注のインデントレベルが誤っていた問題が修正されました:

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

リスト項目でのtabWidth設定を尊重するように変更 (#3990 by @ikatyang)​

CommonMarkがリスト項目内コードブロックの元のMarkdown構文から逸脱していることが判明しました。これにより、Markdown内のインデントされたコードブロックが通常の段落としてレンダリングされるケースが発生していました。この変更ではtabWidthオプションを使用してリスト項目内のインデント量を決定します。詳細については#3459を参照してください。

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

   cd

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

        cd

この変更によりテキストエディタでのインデントも改善されます:

API​

プラグインでのオプションサポートを追加 (#3775 by @ikatyang)​

コミュニティ製言語プラグイン向けベータ版APIの充実に伴い、プラグインが独自オプションを定義できる機能を追加しました!

プラグインオプションがヘルプ表示で出力されるようになりました:

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

同様に、プラグインオプションをコマンドラインで指定できるようになりました:

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

また、プラグインオプションも.prettierrcで定義できるようになりました：

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

設定ファイルでケバブケースのオプションを許可しない (#3622 by @ikatyang)​

Prettierは誤って.prettierrcファイルでオプションのケバブケース表記を許可していました：

{ "print-width": 100 }

これは意図された挙動ではなかったため、修正されました（この場合、printWidthを使用する必要があります）。

設定機能​

--config指定時もEditorConfigを尊重 (#3992 by @josephfrazier)​

これは.editorconfigファイルの扱いに関するマイナーな変更です。以前は--configが指定されると.editorconfigが無視されていました。

Prettierを成功した生産的なオープンソースプロジェクトにしてくれたすべての貢献者とコミュニティに感謝します！皆様の力なしでは成し遂げられませんでした ❤️