Gatsby.jsでSassを導入する手順

Gatsby.jsでSassを導入する手順になります。

gatsby-plugin-sassを導入する

Gatsby.jsでSassを使用するには、プラグインを導入します。

# npm
npm install node-sass gatsby-plugin-sass

# yarn
yarn add node-sass gatsby-plugin-sass

gatsby-config.jsで設定をする

gatsby-config.js

module.exports = {
  /* Your site config here */
  plugins: ["gatsby-plugin-sass"],
}

gatsby-config.jsで、上記のように読み込みます。

これでGatsby.jsでSassが使用可能になります。

※node-sassのバージョンによってエラーが出る場合があります。
Gatsby.js 【Node Sass version 5.0.0 is incompatible with ^4.0.0.】 エラーの対処法