長大な CSS セレクターを見つける

でっかいサイズの CSS セレクターがないかどうかを調べるためのツール。Node.js 製。実行すると result.json に、セレクターが長大な順から並ぶ。該当行数や元コードなどの情報は表示していない。

類似ツールはきっとありふれているんだろうと思う。

コード

const fs = require('fs')
const postcss = require('postcss')

const css = fs.readFileSync('bundle.css', { encoding: 'utf-8' })
const root = postcss.parse(css)
const selectors = []

root.walkRules((rule) => {
selectors.push({
size: rule.selector.length,
selector: rule.selector,
})
})

selectors.sort((selector1, selector2) => {
return selector2.size - selector1.size
})

fs.writeFileSync('result.json', JSON.stringify(selectors, null, ' '))