# Prettier plugin hubl VSC

**URL:** <https://community.hubspot.com/t/prettier-plugin-hubl-vsc/143259>\
**Category:** CMS Development\
**Tags:** local-development\
**Created:** [November 24, 2025, 11:02am UTC](https://community.hubspot.com/t/prettier-plugin-hubl-vsc/143259 "2025-11-24T11:02:41Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Dawidk](https://avatars.discourse-cdn.com/v4/letter/d/a8b319/32.png) [@Dawidk](https://community.hubspot.com/u/Dawidk)\
**Post date:** [November 24, 2025, 11:02am UTC](https://community.hubspot.com/t/prettier-plugin-hubl-vsc/143259/1 "2025-11-24T11:02:41Z")

</div>

I have a problem with two things:  
1. The parser formats each attribute to a new line, which is cool for Hubl but not for HTML. For example, embedding a large SVG file.  
2. I also have a problem with it sometimes replacing code. e.g

`{{ post.post_body|regex_replace("{%\\s*module_block.*?end_module_block\\s*%}", "", "si")|striptags|truncatehtml(250, "...", false) }}`

to

![Dawidk_2-1763982117994.png](https://d2qpr2jzcazej7.cloudfront.net/optimized/3X/4/d/4d835c73426768836a1ef556e935c10225cc9535_2_690x46.png)

I’m using “@hubspot/prettier-plugin-hubl”: “^0.3.5”

 ![Dawidk_1-1763982013490.png](https://d2qpr2jzcazej7.cloudfront.net/original/2X/a/afa821748e4c39e90d081b25ab5fa2be4b22bdac.png)

Is this still being developed?

---

<div class="post-metadata">

**Author:** ![Anton](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/anton/32/103167_2.png) [@Anton](https://community.hubspot.com/u/Anton)\
**Post date:** [November 25, 2025, 9:02am UTC](https://community.hubspot.com/t/prettier-plugin-hubl-vsc/143259/2 "2025-11-25T09:02:21Z")

</div>

Hey @Dawidk,

tried it quite a while ago, but as it did basically nothing, decided to throw it into the wilds.

Got much better results with the config of VSCode/Cursor like described on the [GitHub page](https://github.com/HubSpot/hubspot-cms-vscode?tab=readme-ov-file#language-modes) of the extension.

p.s. There’s no such setting visible (at least for me), but you can edit/create a .vscode/settings.json in your project and put following code into it

```lia-code-sample
{
 "files.associations": {
 "html-hubl": "html",
 "css-hubl": "css",
 "*.html": "html-hubl",
 "*.css": "css-hubl"
 }
}

```

This will stop Prettier do weird stuff to your HubL codes while keeping a nice format

edit:  
I don’t think this extension is being developed anymore as I couldn’t find anything while looking for “HubL Prettier”.

Best,

Anton
