Imports in components use relative paths rather than `$lib`

[codevogel]

Describe the bug

Whenever I try to import a component into another component, the language server seems to suggest a relative path, rather than a $lib path.

Reproduction

1. Install lspconfig
2. Install svelte-language-server using Mason
3. Create a new svelte app using npx sv create app
4. cd app; nvim .
5. touch src/lib/components/component-a.svelte and touch src/lib/components/component-b.svelte
6. Type <ComponentA/> into +page.svelte
7. Code actions (and autocompletions) will suggest an import from $lib:

9. Type <ComponentA/> into component-a.svelte`
10. Code actions (and autocompletions) will suggest an import from ./component-a.svelte:

The same is true for typescript files.

e.g.

11. echo 'export const test = 'test';' > src/lib/testFile.ts
12. In component-a.svelte, attempting to import test will suggest a relative path.

Expected behaviour

Both imports should be imported through $lib. Alternatively, suggest a relative import path, but make $lib the default.

System Info

• OS: [e.g. Windows]

❯ inxi -Sxxx
System:
  Host: codevogel-GLU Kernel: 6.8.0-79-generic arch: x86_64 bits: 64
    compiler: gcc v: 13.3.0 clocksource: tsc
  Desktop: awesome v: 4.3 vt: 7 dm: LightDM v: 1.30.0
    Distro: Linux Mint 22.1 Xia base: Ubuntu 24.04 noble

• IDE: [e.g. VSCode, Atom] Neovim with this config

Which package is the issue about?

svelte-language-server

Additional Information, eg. Screenshots

My LSPconfig

I have tried extending the svelte server capabilities with non-relative as a preference, like so:

svelte = {
   capabilities = {
      workspace = {
         didChangeWatchedFiles = false,
      },
   },
   settings = {
      lint = {
         unknownAtRules = 'ignore',
      },
      typescript = {
         preferences = {
            importModuleSpecifierPreference = 'non-relative',
         },
      },
   },
   preferences = {
      importModuleSpecifierPreference = 'non-relative',
   },
},

:LspInfo:

==============================================================================
vim.lsp:                                     require("vim.lsp.health").check()

- LSP log level : WARN
- Log path: /home/codevogel/.local/state/nvim/lsp.log
- Log size: 49080 KB

vim.lsp: Active Clients ~
- GitHub Copilot (id: 1)
  - Version: 1.378.0
  - Root directory: nil
  - Command: { "node", "/home/codevogel/.local/share/nvim/lazy/copilot.vim/copilot-language-server/dist/language-server.js", "--stdio" }
  - Settings: {
      ["github-enterprise"] = {
        uri = vim.NIL
      },
      http = {
        proxy = vim.NIL,
        proxyStrictSSL = vim.NIL
      }
    }
  - Attached buffers: 30, 28, 110, 23, 159, 19, 138, 174, 173
- eslint (id: 2)
  - Version: ? (no serverInfo.version response)
  - Root directory: ~/work/test/app
  - Command: { "vscode-eslint-language-server", "--stdio" }
  - Settings: {
      codeAction = {
        disableRuleComment = {
          enable = true,
          location = "separateLine"
        },
        showDocumentation = {
          enable = true
        }
      },
      codeActionOnSave = {
        enable = false,
        mode = "all"
      },
      experimental = {
        useFlatConfig = true
      },
      format = true,
      nodePath = "",
      onIgnoredFiles = "off",
      problems = {
        shortenToSingleLine = false
      },
      quiet = false,
      rulesCustomizations = {},
      run = "onType",
      useESLintClass = false,
      validate = "on",
      workingDirectory = {
        mode = "auto"
      },
      workspaceFolder = {
        name = "app",
        uri = "/home/codevogel/work/test/app"
      }
    }
  - Attached buffers: 174, 159, 19, 138, 110, 173
- svelte (id: 3)
  - Version: ? (no serverInfo.version response)
  - Root directory: ~/work/test/app
  - Command: { "svelteserver", "--stdio" }
  - Settings: {}
  - Attached buffers: 138, 159, 19
- lua_ls (id: 4)
  - Version: 3.15.0
  - Root directory: ~/.dotfiles/neovim/.config/nvim
  - Command: { "lua-language-server" }
  - Settings: {}
  - Attached buffers: 23, 28
- stylua (id: 5)
  - Version: 2.3.0
  - Root directory: ~/.dotfiles/neovim/.config/nvim
  - Command: { "stylua", "--lsp" }
  - Settings: {}
  - Attached buffers: 23, 28
- ts_ls (id: 6)
  - Version: ? (no serverInfo.version response)
  - Root directory: ~/work/test/app
  - Command: { "typescript-language-server", "--stdio" }
  - Settings: {}
  - Attached buffers: 110, 174, 173

[jasonlyu123]

The config is typescript.preferences.importModuleSpecifier, not typescript.preferences.importModuleSpecifierPreference. You'll also need the JavaScript version javascript.preferences.importModuleSpecifier. It's used when you don't yet have the <script lang="ts">

[codevogel]

The config is typescript.preferences.importModuleSpecifier, not typescript.preferences.importModuleSpecifierPreference. You'll also need the JavaScript version javascript.preferences.importModuleSpecifier. It's used when you don't yet have the <script lang="ts">

Thanks for that, I'm unsure as to why my autocompletion (not Copilot) suggested importModuleSpecifierPreference.

Anyway, I updated my lspconfig to:

svelte = {
               capabilities = {
                  workspace = {
                     didChangeWatchedFiles = false,
                  },
               },
               settings = {
                  lint = {
                     unknownAtRules = 'ignore',
                  },
                  typescript = {
                     preferences = {
                        importModuleSpecifier = 'non-relative',
                     },
                  },
                  javascript = {
                     preferences = {
                        importModuleSpecifier = 'non-relative',
                     },
                  },
               },
            },

But the same behaviour still occurs;

Adding a lang="ts" script tag has the same behaviour:

I got curious whether it was a nvim-specific issue, so I installed VSCode onto my machine with the Svelte for VSCode extension.

By default, it used the relative paths.
Adding the importModuleSpecifiers to settings.json did start suggesting $lib imports.

So I'm now curious as to what's going wrong in my lspconfig. Sorry for thinking this was a bug!

[codevogel]

It seems my lspconfig was a bit out of date.

I went ahead and cloned Kickstart-nvim-modular, to get a 'fresh start'.

Here's the lspconfig: https://github.com/dam9000/kickstart-modular.nvim/blob/f2309053c75046d5e33084938ef9bba66d9e427e/lua/kickstart/plugins/lspconfig.lua

Again, I added the settings to the lspconfig;

local servers = {
        svelte = {
          capabilities = { workspace = { didChangeWatchedFiles = false } },
          settings = {
            lint = { unknownAtRules = 'ignore' },
            typescript = { enable = true, preferences = { importModuleSpecifier = 'non-relative' } },
            javascript = { enable = true, preferences = { importModuleSpecifier = 'non-relative' } },
          },
        },
        lua_ls = {
          -- cmd = { ... },
          -- filetypes = { ... },
          -- capabilities = {},
          settings = {
            Lua = {
              completion = {
                callSnippet = 'Replace',
              },
              -- You can toggle below to ignore Lua_LS's noisy `missing-fields` warnings
              -- diagnostics = { disable = { 'missing-fields' } },
            },
          },
        },
      }

Still... No bueno!

Then, I noticed that :LspInfo wasn't actually listing any settings for the svelte server. Or any LSP, for that matter...

This led me down a rabbit hole, eventually landing me at nvim-lua/kickstart.nvim#1475
Turns out Mason had an update which broke the passing of settings, which the above PR resolves.

I'll be keeping an eye out on the kickstart.nvim / kickstart-modular.nvim repos to see what 'final' PR addresses these issues, but for the time being, the file changes from the above PR turned out to fix my issue!