web-dev-qa-db-ja.com

重複したCSSルールをチェックする方法は?

私はCSSを台無しにし、どういうわけか重複したルールがたくさんあり、1800の何か行のCSSファイルは3000行以上になりました。

入力としてcssファイルを受け取り、すべての重複ルールをチェックする方法/ツールはありますか?そして、おそらくそれらの冗長性を削除するCSSを生成しますか?

27
Alkshendra

インストールNode JS https://nodejs.org/en/download/

既にノードjsがインストールされている場合、またはopen nodeコマンドをインストールした後、起動時にnode(Windowsマシン上)と入力してプロンプトウィンドウを表示します。

次のコマンドを入力して、css purgeツールをインストールします

npm install css-purge -g

ツールのインストール後、

ノードコマンドプロンプトウィンドウが開いているフォルダーを開き、混乱したcssファイルをそこに貼り付けてから、ノードcmdプロンプトウィンドウに次のコマンドを入力します

css-purge -i style.css -o style_purged.css

style.cssがめちゃくちゃなCSSファイルの名前である場合、上記のコマンドは、CSSルールの重複を含まないstyle_purged.cssという名前の新しいCSSファイルを作成します。

ただし、ご注意ください。コメントも削除されます。 https://www.npmjs.com/package/css-purge

34

CSS Lint を試しましたか?糸くずのそばにある矢印をクリックしてください!ボタンをクリックすると、再生できるオプションがいくつか表示されます。 「重複したプロパティを許可しない」がチェックされていることを確認します

4
joseantgv

CSSLintCSSBurner などのツールをいくつか試しました。また、W3CのCSS Validatorも試しましたが、これは好きではありません。

CSSBurnerで気に入っている点の1つは、色分けされており、すべてのエラーをスクロールして、すばやく繰り返すことができることです。私はすべての繰り返し(およびその他のもの)を非常に高速に見つけました。

1
flamePuppy