【VS Code】Sassをインデントする最も簡単な方法

Sassのコードのインデントを最もてっとり早く行う方法です。

行間や配置が気になる几帳面なコーダーの皆さんは、ぜひお試し下さい。

Visual Studio Codeを使う方向けの記事となります。

目次

やり方

やり方は「formatters scss」というプラグインをインストールするだけです。

まず、VS Codeの左に並んでいるメニューの一番下、「拡張機能」のタブをクリック。

次に上の検索窓に「category:formatters scss」と入力して下さい。

次に上の検索窓に「category:formatters scss」と入力して下さい。

すると一番上に「SCSS Formatter」というプラグインが表示されるので、これをインストール。

SCSS Formatter

「SCSS Formatter」というプラグインが表示されるので、これをインストール

以上です。

インストールが完了したら、あとはSassのコード上で「Alt+Shift+F」を押してみてください。

インデントされるはずです。

あわせて読みたい
【初心者向け】差がつく!Web制作ポートフォリオサイト例10選 ポートフォリオサイトで差をつけたい。でもどんなデザインにしたらいいんだろう?なるべく人とかぶりたくない。スタイリッシュで初心者にも優しいサイトないかな。 とい...
あわせて読みたい
【コピペOK】使える!シンプルな囲み枠デザイン5パターン【HTML】 ブログ記事やLPで使えそうな「囲み枠」を作成しました。 シンプルなデザインなので、様々な用途で使えると思います。 コピペして、お好きに編集してご利用ください。 【...
あわせて読みたい
【コピペOK】LPで使える!Q&Aデザイン4パターン【CSS】 LPなどでよく見かける、Q&Aセクションの作り方です。 コピペしてお好みで色を変えるなど、ご自由にご利用ください。 もちろんレスポンシブにも対応しています。 【...
目次