Svelte layer

Layer for Svelte, for working with .svelte files.

Note: This layer creates a derived mode called svelte-mode on the fly out of web-mode to handle svelte files. It will conflict with the svelte-mode package, make sure you don't use that package together with this layer.

To use this configuration layer, add it to your ~/.spacemacs. You will need to add svelte to the existing dotspacemacs-configuration-layers list in this file.

The Svelte layer uses the backend that's defined by the variable svelte-backend. The options are dumb and lsp. Default is dumb backend. To choose a default backend set the layer variable svelte-backend:

(svelte :variables svelte-backend 'lsp)

To use the on-the-fly syntax checking, install eslint:

$ npm install -g eslint-cli

Check eslint official doc for setting rules

To use automatic code formatting you need to install prettier with:

$ npm install -g prettier

If you want to use local eslint and prettier in your project, turn on node layer dotspacemacs-configuration-layers function:

(node :variables node-add-modules-path t)

web-mode-script-padding is set to 0, so indent is zero at root level inside script tag

Same as react layer, you may refer to the web-mode configuration for fine tuning the indenting behaviour.

For example, if you wan't two space indentation, put this in your dotspacemacs/user-config

(setq-default
 ;; web-mode
 web-mode-markup-indent-offset 2
 web-mode-css-indent-offset 2
 web-mode-code-indent-offset 2
 web-mode-attr-indent-offset 2)