Nuxt3へのリプレイス時のエラー「Preprocessor dependency “sass” not found.」の対応メモ
Vueを活用する中で、
「Nuxt」
のフレームワークを使用して、
各種APIを作成するなど、
小さな規模から試そうと考え、
公式サイトを見ながら、
導入して起動するまでを試した。
今回は、
Laravelのフロントエンド部分で、
Vue.jsを使っていたのだが、
それを分離するために、
Nuxtのバージョンについても、
バージョン２系ではなく、
バージョン３系を導入して、
Nuxtを使っていこうとしたので、
その際にやったことを、
個人的にメモを残しておく。
参考サイト（公式サイト）
こちらのサイトを参考にしました。
リンクをメモ。
Nuxt3の導入時の対応
公式サイトの通りに、
順番にコマンドを実行した時の、
構築メモについては、
以下のサイトや記事を参考に。
発生エラー内容
Nuxtに対して、
既存コードを持ってきて、
動作を確認しようとした時のエラー。
コマンド
npm run devエラー内容
ERROR Internal server error:
Preprocessor dependency "sass" not found.
Did you install it?
Plugin: vite:css対応内容メモ
対応としては、
必要な「sass」をインストールする。
コマンド
npm install --save-dev sass実行結果
$ npm install --save-dev sass
104 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities上記でSassをインストールしたら、
再度、
起動を確認。
コマンド
npm run dev確認結果
$ npm run dev
Nuxi 3.4.2 13:42:40
Nuxt 3.4.2 with Nitro 2.3.3 13:42:40
13:42:41
> Local: http://localhost:3000/
> Network: http://192.168.1.3:3000/
> Network: http://[2400:4152:6182:bb00:55bc:9eea:77f3:aa8c]:3000/
> Network: http://[2400:4152:6182:bb00:70b1:af09:8412:646a]:3000/
> Network: http://[2400:4152:6182:bb00:9154:eec:ff2d:8b6f]:3000/
> Network: http://[2400:4152:6182:bb00:9d4d:b3f:eb6b:e273]:3000/
> Network: http://[2400:4152:6182:bb00:a:b8ef:ffba:a32d]:3000/
> Network: http://[2400:4152:6182:bb00:fc76:ad1f:8e7:a4ba]:3000/
ℹ Vite client warmed up in 563ms 13:42:42
✔ Nitro built in 188 msこちらで、
うまく起動できたので、
この調整で対応できました。
スキルを使って、就職/転職/副業する時のサイト
プログラミングのスキルなどを、自分なりに高めた上で、
自分のスキルをアピールして就職や転職を行い、年収をあげるか、
副業という形で、年収にプラスアルファの稼ぎを増やすことはできます。
まずはできる範囲で取り組むことで、
少しずつ、経験値も増え、自分のスキルが収入につながるのでおすすめです。
