npmコマンド実行時に「glob error { 〜」になった時にやること

プライベートでキャッチアップがてらVue.js×LaravelのSPAを開発している時にnpmのビルド時にエラーが発生しました。

で、解決はできたのでその方法をまとめます。

まず、実行したコマンドとエラー出力です。

実行したコマンド

以下どちらでも同じエラーに
$ docker-compose exec app npm run dev
$ docker-compose exec app npm run watch

Docker環境で開発しているので結局はnpm run dev or npm run watchです。

エラー出力

(略)
glob error { [Error: EACCES: permission denied, scandir '/root/.npm/_logs']
  errno: -13,
  code: 'EACCES',
  syscall: 'scandir',
  path: '/root/.npm/_logs' }

> development
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --config=node_modules/laravel-mix/setup/webpack.config.js
(略)

最終的なビルド結果としては「Vueコンポーネントファイル(.vue)が見つかりません!」というエラーになるのですが、間違いなくVueファイルは指定の場所にある…

しかもこのエラーについてですが、npm run watchを実行しながら開発しててある時急にビルドができなくなったんですよね…

謎すぎる…

というわけで上記のようなエラーになった時の解決につながるかもしれない方法についてご紹介します。

目次

エラーの解決方法

この記事でご紹介する方法は「これをすれば必ず解決する!」というものではなく、

これをすれば解決するかもしれない。一旦やってみて。

というものですm(__)m

1つで解決しない場合は複数組み合わせて試してみてください。

1. npm installし直す

node_modulesとpackage-lock.jsonを削除し、再度npm installします。

$ rm -rf node_modules
$ rm -f package-lock.json
$ npm install

これで再度npm run buildなりnpm run watchなりを実行してください。

2. npmを再インストールする

以下のコマンドを実行してnpmを再インストールします。(再インストール前のアンインストールは不要)

$ npm install -g npm

この後、再度npmコマンドでビルドしてみてください。

3. 対象のファイルの権限を変更する

エラー出力(抜粋)をもう一度載せます。

glob error { [Error: EACCES: permission denied, scandir '/root/.npm/_logs']

この文から「/root/.npm/_logsにアクセスできません」というのがわかります。

ということで以下コマンドで権限を変更します。

$ chmod 777 /root/.npm/_logs

実行できない時はsudoを付ける
$ sudo chmod 777 /root/.npm/_logs

権限番号の777はファイルの所有者、所有グループ、その他が読み取り、書き込み、実行できることを表します。

変更後に以下のような出力になっていれば777になっています。

$ ls -ls
-rwxrwxrwx (略) //出力

Linuxの権限周りに関してはこちらの記事がわかりやすいです。

この後、再度npmコマンドでビルドが成功するか試してみましょう。

4. Dockerコンテナを起動し直す

これはDocker環境で開発している場合のみやってみましょうというものです。

以下コマンドでコンテナの削除→起動を行います。

$ docker-compose down
$ docker-compose up -d

もしくは
$ docker-compose restart

コンテナが起動し終えたら再度ビルドしてみましょう。

最後に

今回は僕の力不足はもちろん、エラー起因がDockerだったりnpmのバージョンだったりで特定することができませんでした…

ただ、この記事で紹介した方法を試せば大抵の場合は解決できるのではないかと思います。

少しでも参考になれば幸いです。

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね!

この記事を書いた人

Webエンジニア←KHI(プラント事業の技術職)←大学院(機械工学)

PHP/Laravel/TypeScript/React/Next.js(Vue.js/Nuxt.jsは少し)
バックエンド歴の方が長いです。

神戸で「つながる勉強会」を運営↓
https://tsunagaru-kobe.connpass.com/

コメント

コメントする

目次
閉じる