Lessフォーマッター
このLess FormatterでLessスタイルシートをフォーマットできます。Lessコードを貼り付けると、ツールが変数、ネストされたルール、パラメーター付きミックスイン、ミックスイン呼び出し、ガード、関数、メディアクエリを、2つのスペースによるインデント、宣言ごとの改行、コロンとカンマの後の一貫したスペースで整えます。ミックスインのパラメーターのデフォルト値は簡潔なまま保たれるため、フロントエンド開発者はコンパイラーを実行せずに読みやすいLessを作成できます。
よくある質問
Less Formatterはどのように動作しますか?
波括弧、セミコロン、コロン、文字列、コメントなどのトークンとしてスタイルシートを読み取り、それらをもとにレイアウトを再構築します。開き波括弧ごとに2つのスペースでインデントされたブロックが始まり、各宣言は独立した行になります。
変数はどのようにフォーマットされますか?
@color: #333;などの変数宣言では、コロンの後にスペースが入り、セミコロンで終わります。値の中の変数参照は記述どおりに保持されます。
パラメーター付きミックスインはどのように処理されますか?
ミックスインのパラメーターを囲む括弧内ではコロンが値に隣接したままになるため、.mixin(@size:10px)のデフォルト値は簡潔な形で保たれます。引数間のカンマの後には1つのスペースが入ります。
ミックスイン呼び出しは独立した行に保たれますか?
はい、.mixin(5px);や.bordered;などの呼び出しはセミコロンで終わり、ルール内の独立した行に配置されます。ネストされたセレクターと&:hoverルールは1段深くインデントされます。
関数や演算子は変更されますか?
darken(@color, 10%)などの関数では、各カンマの後にスペースが入ります。また、プラス記号の両側にもスペースが入るため、1px+2pxは1px + 2pxになります。when (@a > 0)などのガードはセレクター行に保持されます。
このツールはLessをコンパイルしたりチェックしたりしますか?
いいえ、CSSへのコンパイルや構文検証は行わないため、未完成のスニペットもフォーマットできます。エラーの確認とCSSの生成には、Lessコンパイラーをお使いください。
コメントは保持されますか?
はい、// の行コメントは保持され、その行の終わりになります。次のコードはその下から始まります。ブロックコメントも元の位置に保持されます。
インデントは調整できますか?
いいえ。フォーマッターは常に半角スペース2つを使い、設定はありません。そのため、同じスタイルシートからは常に同じ結果が生成されます。
出力がlessとしてコードフェンスで囲まれているのはなぜですか?
結果はlessと指定されたMarkdownコードブロックとして返され、Markdownでシンタックスハイライトされます。.lessファイルに使う場合は、フェンスの間の行をコピーしてください。
スタイルシートのサイズ上限はどれくらいですか?
1回につき最大5 MBです。それを超える入力はメッセージとともに拒否されます。出力はCode FormatterのLessオプションと同じです。