5
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Vim環境でSvelte.jsのシンタックスハイライトをつける

Posted at

はじめに

普段開発時に私が使用しているテキストエディタはVim(正確にはNeovim)なのですが、
Svelte.jsの.svelteファイルを開くと全てのコードが真っ白で開発しずらかったので、何かシンタックスハイライトをつけるいい方法がないか探した。

vim-svelte

一番手取り早いのはVimのプラグインを見つけることだったので、Svelteのプラグイン情報が載っているSvelte Communityで探すことに、、
正直ないだろうなーって思っていたのですが、探したらなんとvim-svelteというものがありました。早速インストールしました。

私のプラグイン管理はdein.tomlで行っていたので、以下のようにプラグインを追加してインストール

[[plugins]] # Svelte.js
repo = 'evanleck/vim-svelte'

再度Vimを開き直して、Sapperのtemplateを確認したところシンタックスハイライトがつきました!!

vim-svelte1.png

見やすい!!

if文にもしっかりついていていい感じです。
vim-svelte2.png

これでVimでも快適にSvelte.jsが使えそうです。

ちなみに初期状態だと<script>タグと<style>タグにインデント挿入されるようになっていますが、以下の設定を追加することで無効化することが可能みたいです。

let  g: svelte_indent_script  =  0 
let  g: svelte_indent_style  =  0
5
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?