Code Monkey home page Code Monkey logo

prettyhtml-vscode's Introduction

Prettyhtml formatter for Visual Studio Code

VS Code package to format your Angular, Vue or pure HTML5 templates.

Usage

Using Command Palette (CMD/CTRL + Shift + P)

1. CMD + Shift + P -> Format Document
OR
1. Select the text you want to Prettify
2. CMD + Shift + P -> Format Selection

Custom keybindings

If you don't like the defaults, you can rebind editor.action.formatDocument and editor.action.formatSelection in the keyboard shortcuts menu of vscode.

Format On Save

Respects editor.formatOnSave setting.

You can turn on format-on-save on a per-language basis by scoping the setting:

// Set the default
"editor.formatOnSave": false,
// Enable per-language
"[javascript]": {
    "editor.formatOnSave": true
}

Settings

Prettyhtml's Settings

options.tabWidth

The space width of your indentation level (default: 2)

options.useTabs

Use tabs instead spaces for indentation (default: false)

options.printWidth

Use different maximum line length (default: 80)

options.usePrettier

Use prettier for embedded content (default: true)

options.prettier

Use custom prettier settings for embedded content (default: local config)

options.singleQuote

Use single quote instead double quotes (default: false)

options.wrapAttributes

Force to wrap attributes (when it has multiple, default: false)

options.sortAttributes

Sort attributes alphabetically (default: false)

Prettier config

By default the resolution algorithm of prettier is used:

  1. Prettier configuration file
  2. .editorconfig

Or if no prettier configuration file exist

  1. .editorconfig

Contribute

Feel free to open issues or PRs!

Running extension

  • Open this repository inside VSCode
  • Debug sidebar
  • Launch Extension

Running tests

Tests open a VSCode instance and load ./testProject as root workspace.

  • Open this repository inside VSCode
  • Debug sidebar
  • Launch Tests

OR

Without having an instance VSCode running (or it won't start) npm run test

prettyhtml-vscode's People

Contributors

starptech avatar

Stargazers

Caspar Gehrmeyer avatar Soar avatar Muhammad Ubaid Raza avatar カシオ 金城 大関 avatar Vlad Dumbrava avatar Michel Makarios avatar Erick Eduardo Petrucelli avatar feathers avatar Shane Padgett avatar Sylvain Dumont avatar

Watchers

Benjamin Staneck avatar James Cloos avatar  avatar  avatar

Forkers

jongio new-future

prettyhtml-vscode's Issues

Add current master builds of vsix files

In order to drive adoption and live testing of this extension, I believe that builds from the vsce package commands should be built using a free CI and available to download and run easily for users.

(such as downloading prettyhtml-vscode-0.0.1.vsix.zip, the latest master build, unpacking, and then using code --install-extension prettyhtml-vscode-0.0.1.vsix).

I'm very happy to set this up, just wondering if this is something y'all would be interested in accepting a PR for!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.