{"id":20315,"library":"prettier-custom-html-indent","title":"Prettier Custom HTML Indent","description":"A fork of Prettier (v3.3.2) that adds custom indentation for HTML attributes, which is impossible to achieve via official plugins or options. This package allows setting a specific indentation width for HTML attributes (htmlAttributeIndent) and defining attributes that should stay on the same line as the tag (sameLineAttributes). It supports JavaScript, TypeScript, JSX, CSS, HTML, Vue, Angular, and more. The fork follows Prettier's release cadence and is compatible with Prettier's existing options and plugins. It is actively maintained as a separate package.","status":"active","version":"3.3.2","language":"javascript","source_language":"en","source_url":null,"tags":["javascript","typescript"],"install":[{"cmd":"npm install prettier-custom-html-indent","lang":"bash","label":"npm"},{"cmd":"yarn add prettier-custom-html-indent","lang":"bash","label":"yarn"},{"cmd":"pnpm add prettier-custom-html-indent","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"This is a fork of prettier, but published as a separate package. It does not require the original prettier as a dependency, but users should not install both.","package":"prettier","optional":false}],"imports":[{"note":"This package replaces prettier. Use the package name 'prettier-custom-html-indent' for all imports.","wrong":"const prettier = require('prettier')","symbol":"prettier","correct":"import prettier from 'prettier-custom-html-indent'"},{"note":"All exports are identical to prettier, but must be imported from 'prettier-custom-html-indent'.","wrong":"import { format } from 'prettier'","symbol":"format","correct":"import { format } from 'prettier-custom-html-indent'"},{"note":"Same as above: use the forked package name.","wrong":"import { resolveConfig } from 'prettier'","symbol":"resolveConfig","correct":"import { resolveConfig } from 'prettier-custom-html-indent'"}],"quickstart":{"code":"import prettier from 'prettier-custom-html-indent';\n\nconst code = `<div class=\"container\" id=\"main\" style=\"display:block\">\\n  <span>Hello</span>\\n</div>`;\n\nconst formatted = prettier.format(code, {\n  parser: 'html',\n  htmlAttributeIndent: 2,\n  sameLineAttributes: ['id'],\n});\n\nconsole.log(formatted);\n// Output:\n// <div class=\"container\"\n//   id=\"main\"\n//   style=\"display:block\"\n// >\n//   <span>Hello</span>\n// </div>","lang":"typescript","description":"Formats HTML with custom attribute indentation (2 spaces) and keeps 'id' on the same line as the tag."},"warnings":[{"fix":"Uninstall prettier and install prettier-custom-html-indent.","message":"This package is a fork of Prettier. Do NOT use it alongside the original Prettier package; only one should be installed.","severity":"breaking","affected_versions":"all"},{"fix":"Monitor the package for updates; consider pinning the version.","message":"The 'htmlAttributeIndent' option is not standard Prettier; it may not be supported in future versions if upstream Prettier changes its API.","severity":"deprecated","affected_versions":">=3.0.0"},{"fix":"Ensure you are formatting HTML files or set parser: 'html' or 'babel' for JSX.","message":"Options 'htmlAttributeIndent' and 'sameLineAttributes' only work with HTML/JSX parsers; they are ignored for other languages.","severity":"gotcha","affected_versions":"all"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Change import to 'prettier-custom-html-indent'.","cause":"You have installed prettier-custom-html-indent but are importing from 'prettier'.","error":"Cannot find module 'prettier'"},{"fix":"Install and import from 'prettier-custom-html-indent'.","cause":"You are using the original prettier package instead of the fork.","error":"Error: Invalid option 'htmlAttributeIndent'. Allowed options: ..."},{"fix":"Use: const prettier = require('prettier-custom-html-indent'); or import prettier from 'prettier-custom-html-indent'.","cause":"Using default import incorrectly with CommonJS require.","error":"TypeError: prettier.format is not a function"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}