Skip to content
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

{name} attributes get formatted to name="name" #474

Closed
EthanThatOneKid opened this issue Aug 21, 2020 · 7 comments
Closed

{name} attributes get formatted to name="name" #474

EthanThatOneKid opened this issue Aug 21, 2020 · 7 comments
Labels
bug Something isn't working Fixed Fixed in master branch. Pending production release.

Comments

@EthanThatOneKid
Copy link

Describe the bug
When formatting on save in VS Code, the svelte.svelte-vscode extension formats {name} attributes incorrectly when .prettierrc's svelteAllowShorthand is false.

To Reproduce
Steps to reproduce the behavior:

1. Set the prettier configuration to the following:

{
  ...,
  "svelteAllowShorthand": false,
  ...
}

2. Configure the VS Code settings like so:

{
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "[svelte]": {
    "editor.defaultFormatter": "svelte.svelte-vscode"
  }
}

3. Use {name} attribute somewhere in your code like so...

<!-- App.svelte -->
<Router {routes} />

Expected behavior
When shorthand is not allowed, {name} attributes, like in <Router {routes} />, are not allowed because it is considered shorthand. This has to be formatted in a non-shorthand manner, such as <Router routes={routes} />, but instead formats to <Routes routes="routes" /> which is not the intention of the developer whatsoever.

System (please complete the following information):

  • OS: Windows
  • IDE: VSCode (v1.48.1)
  • Plugin/Package: Svelte for VSCode (v101.9.3)
@EthanThatOneKid EthanThatOneKid added the bug Something isn't working label Aug 21, 2020
@EthanThatOneKid
Copy link
Author

Obviously (if anyone has this problem), the current workaround would just be to make sure that the svelteAllowShorthand setting in your prettier configuration file is set to true.

{
  ...,
  "svelteAllowShorthand": true,
  ...
}

@dummdidumm
Copy link
Member

This is a problem with the prettier plugin which is tracked here sveltejs/prettier-plugin-svelte#110

@EthanThatOneKid
Copy link
Author

This is a problem with the prettier plugin which is tracked here sveltejs/prettier-plugin-svelte#110

Ah interesting. Thank you for the info. I feel like as many developers as possible should be aware of this bug.

@dummdidumm dummdidumm mentioned this issue Aug 30, 2020
dummdidumm added a commit that referenced this issue Aug 30, 2020
Update svelte, svelte-preprocess, css ls, magic-string, vscode-uri, prettier-plugin-svelte

#323, #474
@dummdidumm dummdidumm added the Fixed Fixed in master branch. Pending production release. label Aug 30, 2020
@dummdidumm
Copy link
Member

This should be fixed with the latest prettier-plugin-svelte version (1.2.0) and the VSCode extension is updated to have this version built-in. If you still experience this issue, you might have a prettier-plugin-svelte in your workspace's node_modules and need to update that.

@Singha360
Copy link

This issue is still persisting on my machine:

  • Ubuntu 20.04
  • VSCode 1.55.0
  • Svelte for VSCode v104.9.1

image

I couldn't find any .pretterrc file within my folders or the prettier-plugin-svelte package in node_modules.

I couldn't find any clue as to what's causing it to not allow me to use shorthands...

@dummdidumm
Copy link
Member

dummdidumm commented Apr 9, 2021

This issue was about a specific shorthand bug, not not being able to use shorthands in general. Did you turn on svelteStrictMode? If so that's the answer. Else I suggest to open a separate issue over at the prettier plugin svelte repo.

@Singha360
Copy link

@dummdidumm yes that was what was causing the issue:

image

Now it works fine!

Also sorry for mentioning this up on the wrong issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working Fixed Fixed in master branch. Pending production release.
Projects
None yet
Development

No branches or pull requests

3 participants