Nuxt.jsでSCSSを使いたい時には新たにライブラリ等をインストール必要があります。
環境下で使える様にするまでの流れをご紹介します。

読者の想定と前提

• nuxt.jsのプロジェクトを作成している
• パッケージマネージャが使える
• scssについて理解している

ライブラリをインストール

yarnで進めていきます。

yarn add sass sass-loader@10

SCSSの記述をする

scssを適用させるには、style属性にlang='scss'を追記します。

<style lang="scss">
.p-contents {
  &__title {
    color: red;
  }
}
</style>

scssの記述方法は今回説明しません。
普段通りの書き方で問題ありません。

デフォルトのタイトル部分を赤色に変えました。