Next.jsに入門しました。 前回、Next.jsでscssを使うという記事で、Next.jsでscssを使ってcssを書く方法をまとめましたが、今回はその流れでNormalize.cssを使う方法について書いておきます。
Normalize.cssは、公式サイトに、
Normalize.css makes browsers render all elements more consistently and in line with modern standards. It precisely targets only the styles that need normalizing.
とあります。僕の理解では、これを使うことで、自前でreset.cssなどを書いてスタイルをリセットする、といったことをしなくて済むようになる、と思っています。
npmまたはyarnで、Normalize.cssのパッケージをインストールします。
npm install --save normalize.css前回の記事「Next.jsでscssを使う」を前提としいます。なので、僕のNext.jsのプロジェクトには、stylesディレクトリがあり、その配下にstyles.scssがあります。
このstyles.scssの中で、Normalize.cssをインポートすることで、プロジェクトに適用することができます。
@import "~normalize.css";
// add your own styles.簡単に使えました！
この先は、Next.jsでMapboxを使って地図を扱う何かを作ってみたいと思っています。