Skip to content

Single Line Per Attribute not working properly in svelte files #318

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
PeytonHanel opened this issue Nov 8, 2022 · 4 comments
Closed

Single Line Per Attribute not working properly in svelte files #318

PeytonHanel opened this issue Nov 8, 2022 · 4 comments

Comments

@PeytonHanel
Copy link

Problem
Single line per attribute is set to true in my project, but prettier only formats multi-attribute html lines when they are past the printWidth length. Prettier seems to work properly because I copied the exact same code into a normal HTML file and it worked as expected there.

Expected Behavior
When Single Line Per Attribute is true it should work exactly the same in svelte files as it does in normal html files.

Steps to Reproduce*
Copy this code into two files, one ending in .svelte and the other ending in .html

<div class="flex flex-col justify-center py-2 lg:h-[var(--hd)] lg:py-0">
    <button on:click="{toggleMenu}" class="btn btn-primary text-lg normal-case">
        Request a Quote
    </button>
</div>

Copy this code into your .prettierrc file

{
  "useTabs": false,
  "tabWidth": 2,
  "singleQuote": true,
  "trailingComma": "none",
  "printWidth": 100,
  "proseWrap": "preserve",
  "pluginSearchDirs": ["."],
  "semi": false,
  "singleAttributePerLine": true,
  "plugins": ["prettier-plugin-tailwindcss"],

  "overrides": [
    {
      "files": "*.svelte",
      "options": {
        "parser": "svelte",
        "svelteSortOrder": "options-scripts-styles-markup",
        "singleAttributePerLine": true
      }
    }
  ]
}

Put this in your package.json
"format": "prettier --write ."

I use yarn, so I run yarn run format from the command line. I get different results in the html and svelte files.

@Conduitry
Copy link
Member

There was a feature request for this in #305 and it was supposedly implemented in #313. Can you confirm what version of this plugin you are using?

@PeytonHanel
Copy link
Author

I'm using prettier-plugin-tailwind which says that it packages prettier-plugin-svelte. I'm using the latest version of that, 0.1.13, but idk which version of the svelte plugin they are using. Should I post an issue there?

@dummdidumm
Copy link
Member

Probably

@Conduitry
Copy link
Member

https://github.com/tailwindlabs/prettier-plugin-tailwindcss/blob/main/package.json prettier-plugin-svelte is a dev dependency of that package, meaning that it's getting bundled when they're publishing their package, and so you're getting 2.7.0 (https://github.com/tailwindlabs/prettier-plugin-tailwindcss/blob/main/package-lock.json) until they update and publish a new version of their package.

@Conduitry Conduitry closed this as not planned Won't fix, can't repro, duplicate, stale Nov 8, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants