Nuxt.jsでSassを使用する

Nuxt.jsでSassを使用する方法をメモ。

設定方法

Nuxt.jsのプロジェクトを準備した後で、必要なパッケージをインストールします。

npm install --save-dev node-sass sass-loader@10

記事作成時点だとsass-loaderのバージョン12.1.0がインストールされるのですが、そのバージョンだと使用時にエラーが出るようだったので、「sass-loader@10」として古いバージョン(10.2.0)をインストールしています。
この部分は適宜変更してください。

これで準備ができたので、CSS記述時にlang=”scss”を追記すればSassが使用できます。

<style lang="scss">
.sample {
  &__aaa {
    background: red;
  }
}
</style>

参考サイト

このエントリーをはてなブックマークに追加

関連記事

コメントを残す

メールアドレスが公開されることはありません。
* が付いている欄は必須項目です

CAPTCHA


コメントが承認されるまで時間がかかります。

2021年9月
 1234
567891011
12131415161718
19202122232425
2627282930