Nuxt.jsのプロジェクトに、Sassを導入する方法を紹介します。
パッケージをインストール
Sassを読み込むためのパッケージをインストールします。
$ npm i -D node-sass sass-loader
これだけで、特に設定ファイルを編集することなくSassを使用することができます。
コンポーネントで使用
SASS記法
コンポーネント内のstyleブロックにlang="sass"
を指定します。
<style lang="sass">
.foo
font-color: red
</style>
SCSS記法
コンポーネント内のstyleブロックにlang="scss"
を指定します。
<style lang="scss">
.foo {
font-color: red;
}
</style>