3

Prettier does a very nice job on HTML generally, but indents pre>code blocks.

I always want pre>code blocks unindented.

Seems like I should be able to configure this in .prettierignore, but can’t find a way that works.

blocks like:

<pre class="line-numbers"><code class="language-json">"operations": [
    "video-cloud/video/all",
    "video-cloud/playlist/all",
    "video-cloud/sharing-relationships/all",
    "video-cloud/notifications/all"
]</code></pre>

Get indented like this:

      <pre class="line-numbers"><code class="language-json">"operations": [
    "video-cloud/video/all",
    "video-cloud/playlist/all",
    "video-cloud/sharing-relationships/all",
    "video-cloud/notifications/all"
]</code></pre>

I want the block left untouched.

Gama11
  • 31,714
  • 9
  • 78
  • 100

3 Answers3

3

Quoting from a deleted answer:

I personally don't use the extension but it seems like prettier has build in configuration for it: https://prettier.io/docs/en/ignore.html

IIUIC, the solution is

<!-- prettier-ignore-start -->
block to keep
<!-- prettier-ignore-end -->

Voting to undelete the answer by "cas v.l." as it led me to the solution in seconds.

maaartinus
  • 44,714
  • 32
  • 161
  • 320
  • Nice. I also tried voting to undelete, but since it was deleted by a moderator, my vote seemed inert. – Ryan Oct 04 '22 at 13:06
  • I have a bounty here about Prettier, in case you're interested. Thanks! https://stackoverflow.com/q/74020543/470749 – Ryan Oct 16 '22 at 13:32
0

You can ignore certain files, but you can't ignore parts of the code.

Lipis
  • 21,388
  • 20
  • 94
  • 121
0

For future reference. In my case, I'm working on a react project. Adding "{` ..your code.. `}" after pre tag, prettier ignores the block. For example:

<pre>    
 {`
   <div className="row">
    <div className="col">
      ...
    </div>
   </div>
 `}
</pre>
Charlie
  • 341
  • 3
  • 11