Disable prettier for a single file Disable prettier for a single file reactjs reactjs

Disable prettier for a single file


If you want a certain file in a repo to never be formatted by prettier, you can add it to a .prettierignore file: Disable Prettier for one file

From the docs:

To exclude files from formatting, create a .prettierignore file in theroot of your project. .prettierignore uses gitignore syntax.

Example:

# Ignore artifacts: build coverage# Ignore all HTML files:*.html 


Thanks to evolutionxbox, so far two solutions were found.

  1. Extension

We can use an extension to toggle formatting like prettier on the specific page when you need it.

Formatting Togglehttps://marketplace.visualstudio.com/items?itemName=tombonnike.vscode-status-bar-format-toggle

  1. Ignoring Code in prettier

Prettier offers an escape hatch to ignore a block of code or prevent entire files from being formatted.

Ignoring Files

To exclude files from formatting, add entries to a .prettierignore file in the project root or set the --ignore-path CLI option. .prettierignore uses gitignore syntax.

/app/src/scripts/example.js

JavaScript

A JavaScript comment of // prettier-ignore will exclude the next node in the abstract syntax tree from formatting.

For example:

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

will be transformed to:

    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>

more: https://prettier.io/docs/en/ignore.html


create .prettierignore file in the root of your repo and add the name of the folders that you want to ignore and add full path of the file that you want to ignore and save it.

use the .gitignore format to update your fileyou can read about it in the prettier website too https://prettier.io/docs/en/ignore.html#ignoring-files