質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
npm

npmは、Node Packaged Modulesの略。Node.jsのライブラリ・パッケージを管理できるツールです。様々なモジュールを簡単にインストールでき、自分でモジュールを作成し公開する際にも使用できます。

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

Q&A

解決済

2回答

3684閲覧

npm run devしたいが、Error: Cannot find module '@nuxtjs/svg'

pecchan

総合スコア555

npm

npmは、Node Packaged Modulesの略。Node.jsのライブラリ・パッケージを管理できるツールです。様々なモジュールを簡単にインストールでき、自分でモジュールを作成し公開する際にも使用できます。

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

1グッド

0クリップ

投稿2022/01/19 20:00

編集2022/01/19 20:40

win10 home / npm8.3.1 / node v16.13.2
バックエンドは経験あるのですが、フロントエンドの知見がない者です。

ローカル環境にプロジェクトを持ってきて、
npm ci
して
npm run dev
したいのですが、途中で躓いております。

win10にnodejsの推奨版v16.13.2をインストールしました。
次に
npm ci
すると以下のように脆弱性の問題を指摘され、npm audit fixを促されました。

PS D:\xxx\frontend> npm ci npm WARN deprecated @types/anymatch@3.0.0: This is a stub types definition. anymatch provides its own type definitions, so you do not need this installed. npm WARN deprecated flatten@1.0.3: flatten is deprecated in favor of utility frameworks such as lodash. npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated npm WARN deprecated har-validator@5.1.5: this library is no longer supported npm WARN deprecated chokidar@2.1.8: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies. npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated npm WARN deprecated sane@4.1.0: some dependency vulnerabilities fixed, support for node < 10 dropped, and newer ECMAScript syntax/features added npm WARN deprecated eslint-loader@4.0.2: This loader has been deprecated. Please use eslint-webpack-plugin npm WARN deprecated querystring@0.2.0: The querystring API is considered Legacy. new code should use the URLSearchParams API instead. npm WARN deprecated babel-eslint@10.1.0: babel-eslint is now @babel/eslint-parser. This package will no longer receive updates. npm WARN deprecated uuid@3.4.0: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details. npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142 npm WARN deprecated svgo@1.3.2: This SVGO version is no longer supported. Upgrade to v2.x.x. npm WARN deprecated core-js@2.6.12: core-js@<3.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js. npm WARN deprecated core-js@2.6.12: core-js@<3.4 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js. > frontend@1.0.0 prepare > node is-production.js || (cd .. && husky install frontend/.husky) husky - Git hooks installed added 2129 packages, and audited 2130 packages in 2m 146 packages are looking for funding run `npm fund` for details 91 vulnerabilities (85 moderate, 6 high) To address issues that do not require attention, run: npm audit fix Some issues need review, and may require choosing a different dependency. Run `npm audit` for details. PS D:\xxx\frontend>

なので
npm audit fix
したのですが、エラーになります。

PS D:\xxx\frontend> npm audit fix npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: sass-loader@10.2.0 npm ERR! Found: node-sass@7.0.1 npm ERR! node_modules/node-sass npm ERR! dev node-sass@"^7.0.1" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peerOptional node-sass@"^4.0.0 || ^5.0.0 || ^6.0.0" from sass-loader@10.2.0 npm ERR! node_modules/sass-loader npm ERR! dev sass-loader@"^10.2.0" from the root project npm ERR! npm ERR! Conflicting peer dependency: node-sass@6.0.1 npm ERR! node_modules/node-sass npm ERR! peerOptional node-sass@"^4.0.0 || ^5.0.0 || ^6.0.0" from sass-loader@10.2.0 npm ERR! node_modules/sass-loader npm ERR! dev sass-loader@"^10.2.0" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force, or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution. npm ERR! npm ERR! See C:\Users\USER\AppData\Local\npm-cache\eresolve-report.txt for a full report. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\USER\AppData\Local\npm-cache\_logs\2022-01-19T19_43_07_467Z-debug-0.log PS D:\xxx\frontend>

ローカル環境が、sass-loader@10.2.0
プロジェクトが、node-sass@7.0.1なのかなと思うのですが、ここからどうして良いのか分かりません。

試したこと

ここから
npm audit fix --force
しましたが、エラーになりました。

PS D:\xxx\frontend> npm audit fix --force npm WARN using --force Recommended protections disabled. npm WARN audit No fix available for nuxt@>=2.3.0 npm WARN audit No fix available for @nuxtjs/composition-api@* npm WARN ERESOLVE overriding peer dependency npm WARN While resolving: sass-loader@10.2.0 npm WARN Found: node-sass@7.0.1 npm WARN node_modules/node-sass npm WARN dev node-sass@"^7.0.1" from the root project npm WARN npm WARN Could not resolve dependency: npm WARN peerOptional node-sass@"^4.0.0 || ^5.0.0 || ^6.0.0" from sass-loader@10.2.0 npm WARN node_modules/sass-loader npm WARN dev sass-loader@"^10.2.0" from the root project npm WARN npm WARN Conflicting peer dependency: node-sass@6.0.1 npm WARN node_modules/node-sass npm WARN peerOptional node-sass@"^4.0.0 || ^5.0.0 || ^6.0.0" from sass-loader@10.2.0 npm WARN node_modules/sass-loader npm WARN dev sass-loader@"^10.2.0" from the root project up to date, audited 2130 packages in 23s 146 packages are looking for funding run `npm fund` for details # npm audit report ---文字数制限につき省略---- 91 vulnerabilities (85 moderate, 6 high) To address issues that do not require attention, run: npm audit fix Some issues need review, and may require choosing a different dependency. PS D:\xxx\frontend>

npm audit fix --legacy-peer-deps
も試しましたがエラーになりました。

PS D:\xxx\frontend> npm audit fix --legacy-peer-deps up to date, audited 2130 packages in 10s 146 packages are looking for funding run `npm fund` for details # npm audit report ---文字数制限につき省略---- 90 vulnerabilities (84 moderate, 6 high) To address issues that do not require attention, run: npm audit fix To address all issues (including breaking changes), run: npm audit fix --force PS D:\xxx\frontend>

脆弱性あっても目的である
npm run dev
さえ実行できれば良いので、
npm run devすると以下のようにエラーになり実行できません。

PS D:\xxx\frontend> npm run dev > frontend@1.0.0 dev > nuxt -p 8000 WARN Module @nuxtjs/svg not found. Please ensure @nuxtjs/svg is in dependencies and installed. 05:01:34 FATAL Cannot find module '@nuxtjs/svg' 05:01:34 Require stack: - D:\xxx\frontend\node_modules\@nuxt\core\dist\core.js Require stack: - node_modules\@nuxt\core\dist\core.js at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15) at Function.resolve (node:internal/modules/cjs/helpers:108:19) at m (node_modules\jiti\dist\jiti.js:1:52953) at Resolver.f [as _require] (node_modules\jiti\dist\jiti.js:1:53766) at Resolver.requireModule (node_modules\@nuxt\core\dist\core.js:381:29) at ModuleContainer.addModule (node_modules\@nuxt\core\dist\core.js:182:38) at node_modules\@nuxt\utils\dist\utils.js:639:43 at async ModuleContainer.ready (node_modules\@nuxt\core\dist\core.js:55:5) at async Nuxt._init (node_modules\@nuxt\core\dist\core.js:478:5) ╭────────────────────────────────────────────────────────────────────╮ │ │ │ ✖ Nuxt Fatal Error │ │ │ │ Error: Cannot find module '@nuxtjs/svg' │ │ Require stack: │ │ - D:\xxx\frontend\node_modules\@nuxt\core\dist\core.js │ │ │ ╰────────────────────────────────────────────────────────────────────╯

Error: Cannot find module '@nuxtjs/svg'
とあるので、こちらのインストールを試みましたが失敗し、また「npm audit fix」を促され堂々巡りになってしまいます・・・。

PS D:\xxx\frontend> npm install @nuxtjs/svg up to date, audited 2130 packages in 4s 146 packages are looking for funding run `npm fund` for details 91 vulnerabilities (85 moderate, 6 high) To address issues that do not require attention, run: npm audit fix Some issues need review, and may require choosing a different dependency. Run `npm audit` for details.

どうすればエラー解消してrun devできるでしょうか?
分かる方教えていただけると幸いです。
宜しくお願い致します。

miyabi-sun👍を押しています

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

@nuxtjs/svgのインストール画面の結果を拝見すると、すでにインストール済であるように見えます。
プロジェクトルートにpackage.jsonというファイルがあるかと思いますが、その中に記載されたパッケージ一覧に@nuxtjs/svgはすでに記載されていないでしょうか?

もしかすると一度npm uninstall @nuxtjs/svgでアンインストールして再度インストールすることでなにかしら状況が変わるかもしれません。

あとはログを見るにvulnerabilityが結構な数出ているようですのでプロジェクトで使用されているパッケージのバージョンが全体的に古い可能性がありそうです。
Node.jsとnpmは最新(LTS)を使用されているのでランタイムとパッケージのバージョンの組み合わせもあるのかもしれないなあと感じます。

Node.jsおよびnpmをダウングレードして試してみるとよいかもしれません。
ちなみにWindowsでしたらnやNodistという複数のNode.jsを切り替えられるツールがあるのでこちらを使うのが便利かと思います。

投稿2022/01/20 03:31

tsuyo_244

総合スコア219

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

pecchan

2022/01/21 13:30

有難う御座います。 この度はすみません、自己解決致しました。
guest

0

自己解決

package.jsonやpackage-lock.jsonを元に戻し、
そのあとでnode_modulesディレクトリを一度削除してnpm ciするとnpm run devが実行できるようになりました。
お騒がせ致しました。

投稿2022/01/21 13:31

pecchan

総合スコア555

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問