【Nuxt.js】SCSSを使えるようにする
以下の記事でNuxt.jsのアプリケーションを生成したのですが、生成したままでは.vueファイル内でSCSSを扱うことができなかったのでパッケージを追加してSCSSが使えるようにしました。
環境情報
OS: Windows10
node.js: version 12.18.0
npm: version 6.14.4
Nuxt.js: version 2.13.0
Nuxt.jsでSCSSを使えるようにする
Nuxt.jsでSCSSを使用できるようにするにはloaderをインストールする必要があります。
以下のコマンドでsass-loaderとnode-sassをインストールできます。
npm i -D sass-loader node-sass
これで.vueファイル内でSCSSを使用できるようになります。
ちなみに
Vue CLIではアプリケーションを生成する際に対話モードでscssなどを使用するかどうか聞かれ、scssを使用するようにするとsass-loaderやnode-sassを含めてインストールしてくれます。