編集

コードの無視

特定のファイルとフォルダを完全に無視（つまり、再フォーマットしない）するには、.prettierignore を使用します。

ファイルの一部を無視するには、「prettier-ignore」コメントを使用します。

ファイルの無視: .prettierignore

フォーマットからファイルを除外するには、プロジェクトのルートに.prettierignoreファイルを作成します。.prettierignoreはgitignore構文を使用します。

例

# Ignore artifacts:
build
coverage

# Ignore all HTML files:
**/*.html

プロジェクトに.prettierignoreファイルを用意することをお勧めします！これにより、prettier --write .を実行して、すべてのファイルがフォーマットされていることを確認できます（不要なファイルを改ざんしたり、生成されたファイルで処理が中断されたりするのを防ぎます）。そして、エディターはどのファイルをフォーマットしないべきかを知ることができます！

デフォルトでは、Prettierはバージョン管理システムのディレクトリ（「.git」、「.sl」、「.svn」、「.hg」）とnode_modules内のファイルを無視します（--with-node-modules CLIオプションを指定した場合を除く）。Prettierは、実行元のディレクトリに存在する場合、".gitignore"ファイルで指定されたルールにも従います。

そのため、デフォルトでは

**/.git
**/.svn
**/.hg
**/node_modules

および

**/.git
**/.svn
**/.hg

--with-node-modules CLIオプションが指定された場合

(--ignore-path CLIオプションも参照してください。)

JavaScript

// prettier-ignoreというJavaScriptコメントは、抽象構文木の次のノードをフォーマットから除外します。

例えば

matrix(
  1, 0, 0,
  0, 1, 0,
  0, 0, 1
)

// prettier-ignore
matrix(
  1, 0, 0,
  0, 1, 0,
  0, 0, 1
)

は、次のように変換されます。

matrix(1, 0, 0, 0, 1, 0, 0, 0, 1);

// prettier-ignore
matrix(
  1, 0, 0,
  0, 1, 0,
  0, 0, 1
)

JSX

<div>
  {/* prettier-ignore */}
  <span     ugly  format=''   />
</div>

HTML

<!-- prettier-ignore -->
<div         class="x"       >hello world</div            >

<!-- prettier-ignore-attribute -->
<div
  (mousedown)="       onStart    (    )         "
  (mouseup)="         onEnd      (    )         "
></div>

<!-- prettier-ignore-attribute (mouseup) -->
<div
  (mousedown)="onStart()"
  (mouseup)="         onEnd      (    )         "
></div>

CSS

/* prettier-ignore */
.my    ugly rule
{

}

Markdown

<!-- prettier-ignore -->
Do   not    format   this

範囲無視

v1.12.0以降で使用可能

このタイプの無視は、最上位レベルでのみ使用可能であり、自動生成されたコンテンツ（例：all-contributors、markdown-tocなど）のフォーマットを無効にすることを目的としています。

<!-- prettier-ignore-start -->
<!-- SOMETHING AUTO-GENERATED BY TOOLS - START -->

| MY | AWESOME | AUTO-GENERATED | TABLE |
|-|-|-|-|
| a | b | c | d |

<!-- SOMETHING AUTO-GENERATED BY TOOLS - END -->
<!-- prettier-ignore-end -->

YAML

YAMLファイルの一部を無視するには、# prettier-ignoreを無視するノードの直上の行に配置する必要があります。

# prettier-ignore
key  : value
hello: world

GraphQL

{
  # prettier-ignore
  addReaction(input:{superLongInputFieldName:"MDU6SXNzdWUyMzEzOTE1NTE=",content:HOORAY}) {
    reaction {content}
  }
}

Handlebars

{{! prettier-ignore }}
<div>
  "hello! my parent was ignored"
  {{#my-crazy-component     "shall"     be="preserved"}}
    <This
      is  =  "also preserved as is"
    />
  {{/my-crazy-component}}
</div>

コマンドラインファイルパターン

.prettierignoreに追加せずにファイルを無視したい場合、一度限りのコマンドでは、ネガティブパターンが便利です。

prettier . "!**/*.{js,jsx,vue}" --write

fast-globを参照して、高度なglob構文の詳細を確認してください。