sveltejs / prettier-plugin-svelte

Format your svelte components using prettier.
MIT License
737 stars 97 forks source link

Choose what to format #55

Open gbouteiller opened 5 years ago

gbouteiller commented 5 years ago

Hello, First of all, thank you for your work. I'm currently using your plugin via the vscode extension but I posted the issue here as I think it is more appropriate. I'm using pug templating so I have 3 main tags in my files : template, script and style. Currently, the plugin does not give you the opportunity to choose what to format and I ended up deactivating formatting because it messes up my pug template. Would it be possible to activate/deactivate formatting for script/style/template independently as it is the case for Vue with Vetur? Thank you.

umanghome commented 5 years ago

I'm using stylus for my CSS and this plugin either messes the styles up or refuses to process the file altogether. Would love an option to bypass prettifying everything inside the <style> tag.

ghost commented 5 years ago

I have the same problem as @umanghome. I can't even disable it, it's terrible. please at least let us disable it!

jesseskinner commented 4 years ago

Would implementing <!-- prettier-ignore --> here address the issue? See https://prettier.io/docs/en/ignore.html

Seems it is already partially implemented for HTML, but not for <script> and <style>.

dummdidumm commented 3 years ago

Choosing what to format feels like the wrong solution, prettier is an opinionated code formatter after all. What we can - and did - though is to disable formatting for unsupported languages and supporting the <!-- prettier-ignore --> comment which marks the next node as "do not format". What's missing is support for default languages from svelte.config.js but I'm not sure if we can add this in a good way.

RapidOwl commented 3 years ago

I'm having a bit of trouble with this. <!-- prettier-ignore --> does not prevent formatting from occurring in my Svelte files. The example below shows the mess Prettier has made of a style element inside a template literal. I'm using the official Svelte plugin for VS Code and Svelte 3.0.

<!-- prettier-ignore -->
<script>
    export let animationName;
    export let calculatedLength;
    export let keyFrames;

    let styleElement = `
<style ✂prettier:content✂="Cgkuc3R1ZmYgewoJCWNvbG9yOiByZWQ7Cgl9Cg=="></style>
    `;
</script>

I'm getting around it for now by adding the file in question to my .prettierignore.