Quantcast
Channel: Vimタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 5608

Vimでtreeっぽくディレクトリ構成を書きたい、そんなアナタの為のVim Plugin、できてます。

$
0
0

この記事は Vim (その2) Advent Calendar 2016 - Qiitaの15日目です。

こんな時ってありませんか?

  • 記事を書く時に、サンプルディレクトリ構成をtreeで表現したい
  • でも手元のディレクトリは余計なファイルが多い
  • 手元のディレクトリを$ tree > vim -で出力 & Vimで余計なファイルを消す

もしくはこんな時ってありませんか?

  • 記事を書く時に、サンプルディレクトリ構成をtreeで表現したい
  • でも手元にいいディレクトリがない
  • ダミー構成を $ mkdir hoge$ touch hogege-でつくって $ tree > hoge.mdで書き出す

もっと楽にtreeっぽくディレクトリ構成が書けるVim Pluginつくりました

shinespark/vim-list2tree: GitHub

使い方は簡単です。markdownのlist記法でディレクトリ構成を書いて、

* .
  * dir
    * file
    * file
    * file
  * dir
    * dir
      * file
      * file
  * file

行選択をして、:'<,'>List2Treeを叩くだけです。

.
├── dir
│   ├── file
│   ├── file
│   └── file
├── dir
│   └── dir
│       ├── file
│       └── file
└── file

デモ

https://gyazo.com/62150c7ba5ce5ffdd371a930e54893cc

マッピング

お好みで、↓のようにマッピングして、Ctrl + Tなどでtree化することも可能です。1

vnoremap<c-t> :<c-u>'<,'>List2Tree<CR>

ambiwidth について

set ambiwidth=doubleとvimrcに書いている方は罫線素片が崩れてみえることもありますが正常です。通常のtreeの罫線素片も set ambiwidth=double環境では崩れてみえます。(気になる方は :set ambiwidth=してみてください。)

treeと同じ罫線素片で構成されている為、一般的なmarkdownに対応したサービス(GitHub, Qiita, はてなブログ, etc.)では崩れず表示されます。

後はVimで記事を仕上げてGitHubやQiitaやはてなブログに公開するだけです。

初めての自作 Vim Plugin

ということで、今回初のVim Pluginをつくってみました。

5年前にVimを使いはじめた私のVim力は、ちょこっとvimrcが充実しているレベル程度で、正直Vim Scriptがよく分かってないレベルでした。

Vim Script については、

を参考にしました。

基本的にはVim Scriptがよく分かってないので :helpです。書いてて他言語との差異を確認する必要が出てくるので、結局は :help eval部分を通読するのが確実なのかもしれません。

Vim Plugin については、

を参考にしました。Vimプラグインが出来るまで - ぼっち勉強会はautoloadとpluginディレクトリの違いも分かっていないレベルの私にとって、段階的に学べるように構成されていたので非常に助かりました。

ということで、本記事ではVimでtreeっぽくディレクトリ構成を書く為のPlugin shinespark/vim-list2tree: GitHubの紹介と、初めてのVim Plugin制作のお話でした。

自分の使っているVim Pluginすらまともにコードを読めてなかったのですが、一度実際にPluginを書いてみたら多少読めるようになったのでやはりより知識を求めるなら実際に書いてみるのが一番だと実感しました。

それではよい Happy Vim Life を。


  1. Ctrl + Tは他のキーバインドと競合することもある為、環境に応じて他のキーに割り当ててください。 


Viewing all articles
Browse latest Browse all 5608

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>