Nuxt.jsのプロジェクトにSassを導入する方法

Nuxt.jsのプロジェクトにSassを導入する方法:

Nuxt.jsのプロジェクトにSassを導入する方法を紹介します。

パッケージをインストール

Sassを読み込むためのパッケージをインストールします。

$ npm i -D node-sass sass-loader

これだけで、特に設定ファイルを編集することなくSassを使用することができます。

コンポーネント内のstyleブロックにlang="sass"を指定します。

<style lang="sass"> 
.foo 
    font-color: red 
</style>

コンポーネント内のstyleブロックにlang="scss"を指定します。

<style lang="scss"> 
.foo { 
    font-color: red; 
} 
</style>