editor: auto-import style

[avetisk]

Check for existing issues

• [X] Completed

Describe the feature

There's an option in VS Code called "import module specifier" which allows to choose how the auto-imports are written.

This would be great in order to not waste time rewriting all auto-imports to match the desired import style.

If applicable, add mockups / screenshots to help present your vision of the feature

No response

[joaquim-verges]

Seconding this - this is the main blocker for me to switch fully to Zed

[binary-koan]

Adding this in settings is working for me:

{
  ...
  "lsp": {
    "typescript-language-server": {
      "initialization_options": {
        "preferences": {
          "importModuleSpecifierPreference": "non-relative"
        }
      }
    }
  }
}

[antoyne7]

This solution is no longer working with vtsls typescript LSP

Adding this in settings is working for me:

{
  ...
  "lsp": {
    "typescript-language-server": {
      "initialization_options": {
        "preferences": {
          "importModuleSpecifierPreference": "non-relative"
        }
      }
    }
  }
}

[pcalves]

FWIW, this works for me after running into the same issue as @antoyne7:

{
  ...
  "language_servers": ["...", "!vtsls", "typescript-language-server"],
  "lsp": {
    "typescript-language-server": {
      "initialization_options": {
        "preferences": {
          "importModuleSpecifierPreference": "non-relative"
        }
      }
    }
  }
}

[patrickswijgman]

I tried all kinds of different ways to configure the vtsls language server but I can't seem to get it working :sob:

  "lsp": {
    "vtsls": {
      "initialization_options": {
        "typescript": {
          "preferences": {
            "importModuleSpecifier": "non-relative",
            "importModuleSpecifierEnding": "js"
          }
        }
      }
    }
  }

Or like so

  "lsp": {
    "vtsls": {
      "initialization_options": {
        "preferences": {
          "typescript.preferences.importModuleSpecifier": "non-relative",
          "typescript.preferences.importModuleSpecifierEnding": "js"
        }
      }
    }
  }

I have looked at the docs of this vtsls language server but I can't seem to get it working. The answer of @pcalves by switching to the typescript-language-server is working but I would like to keep using the standard language server for typescript that Zed offers instead of working around it, if possible

[kristiyanraykov]

After trying a good amount of permutations, this ended up doing the work for me with vtsls:

  "lsp": {
    "vtsls": {
      "initialization_options": {
        "typescript": {
          "preferences": {
            "importModuleSpecifier": "relative"
          }
        }
      }
    }
  }

[kantuni]

^ this did it. P.S. Don't forget to change it to "non-relative".

[tp6gw94]

In zed version 0.154.2 it's not work

[giannisp]

@tp6gw94 Replace initialization_options with settings.

[tp6gw94]

@tp6gw94 Replace initialization_options with settings.

@giannisp It's work! Thank you.

    "vtsls": {
      "settings": {
        "typescript": {
          "preferences": {
            "importModuleSpecifier": "non-relative"
          }
        }
      }
    },

[thatc0py]

Hi all! Is there a documentation for all this magic words?

[ps173]

@procopym You can look into the configuration options of the language server for further tinkering

[thomasaull]

Does anyone has an idea how to enable the relative option for .vue files? With this config:

{
  "lsp": {
    "vtsls": {
      "settings": { 
        "typescript": {
          "preferences": {
            "importModuleSpecifier": "relative"
          }
        },
      }
    }
  }
}

It works for .ts files but in .vue it behaves like when the value is "non-relative"