まとめ

困っていたこと
Reactで開発していて、 components/{Component名}/index.jsとしてディレクトリをわけていたら、ステータスラインにファイル名しか表示されないと「どのindex.jsだよ！」となった。

解決策

Before

After

一つ上のディレクトリまで表示することにしました。

やったこと

lightlineを使っていたため、 lightlineのカスタマイズをすることにしました。

公式READMEの"ファイル名と変更サインの間のバーを消すことはできますか？"を参考にしました。

完成形vimrc

letg:lightline={      \'component_function':{      \'filename':'LightLineFileNameWithParentDir'      \}      \}function! LightLineFileNameWithParentDir()if expand('%:t')==# ''lets:filename='[No Name]'elselets:dirfiles= split(expand('%:p'),'/')if len(s:dirfiles)<2lets:filename=s:dirfiles[0]elselets:filename=s:dirfiles[-2].'/'.s:dirfiles[-1]endifendifreturns:filenameendfunction

解説
lightlineの設定を入れる変数である g:lightlineに component_functionという、新しい表示項目を生成、もしくは既存の項目を上書きする関数を登録する項目があります。
既存のfilenameという項目はREADMEを見る限り¹expand('%:t') !=# '' ? expand('%:t') : '[No Name]'で表示されているようなので、それを参考にカスタマイズしました。