vscode-tidyhtml

Format HTML using Tidy-HTML5

This extension will format html from unformatted state

<div ng-controller="AlertDemoCtrl">
<script id="alert.html"
type="text/ng-template">
<div class="alert" role="alert" style="background-color:#fa39c3;color:white">
<div ng-transclude=""></div>
</div>
</script>
<uib-alert close="closeAlert($index)" type="{{alert.type}}" ng-repeat="alert in alerts">{{alert.msg}}</uib-alert>
<uib-alert template-url="alert.html">A happy alert!</uib-alert>
<button ng-click="addAlert()" class='btn btn-default' type="button">Add Alert</button>
</div>

to formatted state

<div ng-controller="AlertDemoCtrl">
  <script id="alert.html"
          type="text/ng-template">
    <div class="alert"
         role="alert"
         style="background-color:#fa39c3;color:white">
      <div ng-transclude=""></div>
    </div>
  </script>
  <uib-alert close="closeAlert($index)"
             ng-repeat="alert in alerts"
             type="{{alert.type}}">{{alert.msg}}</uib-alert>
  <uib-alert template-url="alert.html">A happy alert!</uib-alert>
  <button class='btn btn-default'
          ng-click="addAlert()"
          type="button">Add Alert</button>
</div>

Usage

• Run with F1 TidyHtml
• you can enable autosave on html files by setting tidyHtml.formatOnSave to true or to an array of file extensions

Settings

• tidyHtml.formatOnSave
  • auto format html files. If set to value true only .html will be formatted. You can provide an array of file extension to format other filetype e.g. ['.html', '.php']
• tidyHtml.tidyExecPath:
  • file path to tidy exe. If no path is provided, the build in tidy exe (v 5.2.0) will be used
• tidyHtml.optionsTidy
  • list of command line arguments for tidy exe. Here you can find a full list of available options: Tidy-HTML5
  • if you create a .htmlTidy json file in the workspace root, then this options are preferred. Please prefer the workspace settings of vscode. This option is deprecated and not tested anymore
  • default options:

 {
    "markup": true,
    "output-xml": false,
    "input-xml": true,
    "show-warnings": true,
    "show-errors": 6,
    "numeric-entities": false,
    "quote-marks": false,
    "quote-nbsp": true,
    "quote-ampersand": false,
    "break-before-br": false,
    "preserve-entities": true,
    "uppercase-tags": false,
    "uppercase-attributes": false,
    "indent": "auto",
    "indent-with-tabs": false,
    "indent-attributes": true,
    "sort-attributes": "alpha",
    "wrap": 250
}

• tidyHtml.enableDynamicTags
  • automatically attach html tags containing '-' in the option new-blocklevel-tags
  • tidy exe refuses to format a document with unknown tags. If you want to format a document with e.g angular directives this setting is useful.
• tidyHtml.errorNotification/ tidyHtml.warningNotification
  • type of notification on error or warning
• tidyHtml.stopOnWarning
  • stop format if warnings exist

Linux execution bit

• This extension uses Tidy-HTML5 by command line call. I try to provide the needed applications for all os types, but I test only on windows. One reason for the bad reviews is, the missing linux execution bit. Please feel free to set the execution bit on your own, if I forget it. You are welcome to create an issue. Thanks.

Changelog

• v1.10.0

  • fixed tidy exec detection

• v1.9.0

  • release with linux, because last release had POSIX File attributes missing
  • better error message for missing execution bit. thanks to@sglaser

• v1.8.0

  • workspacefolders are now supported

• v1.7.0

  • same like 1.6.0. invalid publish

• v1.6.0

  • fixed error after formatting empty file
  • added traceLogging for extendend logging

• v1.5.0

  • publishing on win machines looses posix file attributes. now I am a happy ubuntu user.

• v1.4.0

  • statusbar message on format error and warnings (one reason for not so nice reviews)
  • update Tidy-HTML5 to v5.4.0

• v1.3.0

  • auto format is triggered by willSave instead of didSave.

• v1.2.0

  • updated category
  • fixed error preventing auto format

• v1.1.0

  • tried to fix a linux error

• v0.0.5

  • fixed an uppercase error on linux machine

• v0.0.4

  • fixed missing tidy exe

• v0.0.3

  • optional warning dialog on format error

• v0.0.2

  • add missing properties in package.json

• v0.0.1

  • converted extension atom-htmltidy to vscode extension
  • changed js source to typescript source
  • removed linting feature
  • removed unnecessary options

License

MIT © Andreas Weber

Credits

• Tidy-HTML5
• HTML Tidy Library Project