概要
eslint実行時にlintとは別のエラーが発生したのでその解消方法を共有します
この記事で分かること
以下エラーの解消方法
Error: Failed to load plugin 'vue' declared in '.eslintrc.cjs'エラー内容
$ yarn lint:fix
yarn run v1.22.19
$ eslint --fix --ext .jsx,.js,.tsx,.ts,.vue .
Oops! Something went wrong! :(
ESLint: 8.20.0
Error: Failed to load plugin 'vue' declared in '.eslintrc.cjs': Cannot find module '../utils'
Require stack:
- /Users/hiroya/Documents/pg/my-vue-app/node_modules/eslint-plugin-vue/lib/rules/array-bracket-newline.js
- /Users/hiroya/Documents/pg/my-vue-app/node_modules/eslint-plugin-vue/lib/index.js
- /Users/hiroya/Documents/pg/my-vue-app/node_modules/@eslint/eslintrc/dist/eslintrc.cjs
Referenced from: /Users/hiroya/Documents/pg/my-vue-app/.eslintrc.cjs
at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
at Function.Module._load (node:internal/modules/cjs/loader:778:27)
at Module.require (node:internal/modules/cjs/loader:1005:19)
at require (/Users/hiroya/Documents/pg/my-vue-app/node_modules/v8-compile-cache/v8-compile-cache.js:159:20)
at Object.<anonymous> (/Users/hiroya/Documents/pg/my-vue-app/node_modules/eslint-plugin-vue/lib/rules/array-bracket-newline.js:6:26)
at Module._compile (/Users/hiroya/Documents/pg/my-vue-app/node_modules/v8-compile-cache/v8-compile-cache.js:192:30)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
at Module.load (node:internal/modules/cjs/loader:981:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Module.require (node:internal/modules/cjs/loader:1005:19)
error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.結論
eslint-plugin-vue をアップグレードする
環境
- node v16.16.0
- yarn 1.22.19
原因
エラー文にもちらほら出ていますが、今回の場合 eslint-plugin-vue のバージョンが古いことが原因だったようです
解決策
yarn upgrade eslint-plugin-vue で eslint-plugin-vue をアップグレードする
$ yarn upgrade eslint-plugin-vue
yarn upgrade v1.22.19
[1/4] 🔍 Resolving packages...
[2/4] 🚚 Fetching packages...
[3/4] 🔗 Linking dependencies...
warning " > vite-plugin-vuetify@1.0.0-alpha.12" has incorrect peer dependency "vite@^2.7.0".
warning " > vue-cli-plugin-vuetify@2.5.1" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
warning "vue-cli-plugin-vuetify > null-loader@4.0.1" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
[4/4] 🔨 Rebuilding all packages...
success Saved lockfile.
success Saved 15 new dependencies.
info Direct dependencies
└─ eslint-plugin-vue@9.3.0
info All dependencies
├─ acorn-jsx@5.3.2
├─ acorn@8.8.0
├─ boolbase@1.0.0
├─ cssesc@3.0.0
├─ eslint-plugin-vue@9.3.0
├─ estraverse@5.3.0
├─ lodash@4.17.21
├─ lru-cache@6.0.0
├─ ms@2.1.2
├─ nth-check@2.1.1
├─ postcss-selector-parser@6.0.10
├─ util-deprecate@1.0.2
├─ vue-eslint-parser@9.0.3
├─ xml-name-validator@4.0.0
└─ yallist@4.0.0
✨ Done in 3.42s.