We already have the infra for splitting Vue component into multiple regions, and currently we feed
<template>
: none<style>
: prettier with parser css
/ scss
/ less
<script>
: prettier with parser babylon
/ typescript
Instead of waiting for prettier's html formatter, https://github.com/reshape/reshape by @jescalan seems to be in better shape already. With two more things, I think I can put it in as the default html formatter for Vetur:
printWidth
. This is especially important for wrapping html attributes. eg:
<div attr="foo" attr="foo" attr="foo" attr="foo" attr="foo" attr="foo" attr="foo" attr="foo" >bar</div>
to
<div attr="foo" attr="foo" attr="foo" attr="foo" attr="foo" attr="foo" attr="foo" attr="foo" >bar</div>
Handling of interpolation in attributes and mustache brackets. Example from Vue doc: https://vuejs.org/v2/guide/class-and-style.html#Object-Syntax
<div class="static" v-bind:class="{ active: isActive, 'text-danger': hasError }"> </div>
The class object can be very long and needs to be formatted to multiline.
Another thing we could do is to make a CLI based on prettier + reshape + vue-template-compiler. Basically just using vue-template-compiler
instead of Vetur's region splitting.
vue component -> vue-template-compiler
- template -> reshape
- style -> prettier
- script -> prettier
-> assemble into prettierified vue component
@jescalan Do you have any thoughts? Would you be interested in working together on this?
johncloud200, ryanmr-daugherty, palaima, fabsenet, herkulano and 32 morejohncloud200, rndmerle, jefrydco and johnsmithjsjsjohncloud200, esko, bsaf, Glogo, jefrydco and 1 morezoffyzhang, johnyluyte, johncloud200, mrg0lden, esko and 5 more
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4