add leptosfmt to Zed settings.json

Question

currently i'm typing

leptosfmt .

each time i want to format the html within the view!{} macro. I'd like to automate this on save or whenever rustfmt runs.

I tried adding a rustfmt section to my Zed settings.json, to support leptos, but it seemed to break formatting of my code. Anyone know the correct way to do this?

{
  "telemetry": {
    "diagnostics": false,
    "metrics": false
  },
  "ui_font_size": 16,
  "buffer_font_size": 16,
  "autosave": "on_focus_change",
  "lsp": {
    "rust-analyzer": {
      "procMacro": {
        "ignored": [
          // "component",
          "server"
        ]
      },
      "rustfmt": {
        "overrideCommand": ["leptosfmt", "--stdin", "--rustfmt"]
      }
    }
  }
}

Jon Saw · Accepted Answer · 2024-07-29 02:22:54Z

1

I'm not sure what part of your formatting is breaking but I've managed to get it to work successfully by setting up a command in format_on_save. I've also successfully configured Zed to format Rust code using external tools like rustfmt, leptosfmt, and rustywind. Here's a breakdown of the setup:

.zed/settings.json configuration

{
  "languages": {
    "Rust": {
      "format_on_save": {
        "external": {
          "command": "bash",
          "arguments": [".zed/format.sh"]
        }
      }
    }
  },
  "lsp": {
    "rust-analyzer": {
      "procMacro": {
        "ignored": ["component", "server"]
      }
    }
  }
}

.zed/format.sh script

#!/usr/bin/env bash
rustfmt | leptosfmt --stdin| rustywind --output-css-file "$(pwd)/style/main.scss" --stdin

I'm using Zed 0.145.1

Notes:

Make sure you have rustfmt, leptosfmt, rustywind installed in your terminal.
You may also need to setup a rustfmt.toml with a correct Rust edition:
```
edition = "2021"
```
You should set this up in your project folder (not in your main config). Instructions can be found here.

edited Jul 29, 2024 at 2:22

answered Jul 25, 2024 at 8:24

Jon Saw

8,1306 gold badges52 silver badges60 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Rusty Rob Over a year ago

thanks. is it possible to toggle this by workspace? e.g. leptos specific projects

Jon Saw Over a year ago

Yes, it's possible. You'll just need to create a folder called .zed within your project. Instructions found here. Let me know if you need more guidance

Jon Saw Over a year ago

I've added a note in the instructions. Thanks for pointing this out @RustyRob.

Collectives™ on Stack Overflow

add leptosfmt to Zed settings.json

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related