mediaQueryの記述を効率化するためのラッパーを npm package で作ってみた - Qiita

はじめに 毎回微妙に違うけど似たようなロジックを、プロジェクト毎に組んでしまいがちです。 どうせいつも使うなら、自分用に npm package 化し、方針変更をバージョンアップで受け取れるようにしておく方が、理にかなってるような気がしたので、今回学習と実験を兼ねて作ってみました。 簡単に作れそうなものとして、css の MediaQueries を題材に選んでみました。 おそらく似たようなpackageは大量に存在しているとは思っていますが、自力で車輪を発明することも今回の趣旨なので、ご容赦を。 大枠の方針 link要素での使用は禁止。 .class内で細かく分岐させる。 breakpointは 任意の数を定数で管理。プロジェクトに応じて簡単にoverride可能にする。 MediaQueries用のラッパー関数を中継して記述。生では書かない。 mobile first / deskto