13
8

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.

【VSCode】VSCodeでBladeテンプレートを整形する

Last updated at Posted at 2020-04-19

概要

VSCode(Windows)ではShift+Alt+Fでコードをフォーマットしてくれるのですが、拡張機能をインストールするだけではblade.phpのコードをフォーマットしてもらえませんでした。
そこで、調べてみると2つの方法があったため投稿します。

settings.jsonで編集する

settings.jsonを開く

コマンドパレットでsettings jsonを入力してsettings.jsonを開きます。
メニュータブから選択しなくても、F1またはCtrl+Shift+Pでコマンドパレットを開くことができます。

設定を記述する

以下の内容を記述してVSCodeを再起動します。

setting.sjon
"files.associations": {
    "*.blade.php": "html"
},

拡張機能を使用

拡張機能のインストールする

拡張機能からLaravel Blade Snippetsをインストール検索してインストールします。

拡張機能の検索は左側のタブバーで開くかCtrl+Shift+Xで開けます。
タブバーを開くだけならCtrl+Bでも可能です。

自分はこの拡張機能をインストールだけして、フォーマットの設定していなかったため体裁を整えてもらえませんでした。

拡張機能の設定を変更する

設定画面を開いて左側のメニューから 拡張機能 → Blade Configuration を選択し、右側メニューのEnable format blade fileにチェックを入れて再起動します。

screenshot_20200420_020428.png

13
8
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
13
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?