vue-prettier

Prettify .vue files with Prettier

Why

• Uses vue-template-compiler instead of regexp to parse .vue files
• same CLI args as prettier (can be used as a drop-in replacement)

Note that this is a temporary solution while waiting for Prettier to support Vue.js.

Install

$ npm install --global vue-prettier

Make sure that you also have vue-template-compiler as a dev dependency (which should be the case if you use vue-loader or rollup-plugin-vue)

$ npm install --save-dev vue-template-compiler

Usage

CLI

$ vue-prettier --write my-component.vue

Editor integration

Vim

Install vim-prettier and set the prettier CLI executable path

let g:prettier#exec_cmd_path = "~/path/to/cli/vue-prettier"

Webstorm

Follow the official Webstorm Setup and set the Program to vue-prettier

Visual Studio Code

Visual Studio Code supports formatting .vue files thanks to the Vetur extension. More informations can be found in the formatting page.

Credits

This project wouldn't be possible without the great work on these projects

• pretty-vue.sh
• prettier-vue

License

MIT © Olivier Ligot