Warning on XO install: has unmet peer dependency webpack

[niftylettuce]

warning "xo > eslint-import-resolver-webpack@0.12.1" has unmet peer dependency "webpack@>=1.11.0".

[leonsilicon]

For what it's worth, I created a package ignoredep so you can add this to your package.json:

{
  "dependencies": {
    // ...
    "webpack": "npm:ignoredep@>=1.11.0",
    // ...
  }
}

and that should get rid of the error message (at least, it did for me)

[flying-sheep]

Nice hack, thank you! But can we fix this properly?

I assume the way this works is that xo uses some method to check if webpack is used. Either

1. it uses eslint-import-resolver-webpack to check if webpack is used. If so, we’re out of luck and need to use some hack like this, but
2. if the check is independent, eslint-import-resolver-webpack should move to peerDependencies and get "peerDependenciesMeta": {"eslint-import-resolver-webpack": {"optional": true}}

[fregante]

One of suggested solution is probably right, actually:

• set eslint-import-resolver-webpack as an optional peer dependency of XO

Now the choice is between:

• XO users ignoring this single warning that happens during install, or
• making that change + throwing an error when webpack.config.js is detected but eslint-import-resolver-webpack isn't installed

Given how similar issues have been handled, I don’t think the latter will happen since XO is seen as "batteries included" and because the warning isn't a big deal. But let's see what the maintainers think.

I also tried peerDependenciesMeta but it did not work.

Similar issues:

• TypeScript as optional dependency? #437

[fregante]

The other issue is that I can't replicate this issue with npm 7 nor with npm 8. webpack is installed as a dependency now:

$ npm install xo
$ npm ls webpack
└─┬ xo@0.51.0
  └─┬ eslint-import-resolver-webpack@0.13.2
    └─┬ webpack@5.74.0
      └─┬ terser-webpack-plugin@5.3.3
        └── webpack@5.74.0 deduped

What npm version do you use? Can you replicate this issue in a fresh project? Try this in an empty folder and take a screenshot:

node --version
npm --version
npm init -y
npm install xo
npm ls webpack

[fregante]

So I found out: This is a Yarn-specific issue that was fixed in npm 7 and npm 8.

I don’t think anyone is interested in adding a workaround for something that Yarn developers choose to ignore. So you have two choices:

• lobby for it on Yarn’s repo Add a means to install package peer dependencies for development / testing yarnpkg/yarn#1503
• ignore the warning. it's a single warning on an install that happens once at the start of a project. it can be ignored.

[arcanis]

So I found out: This is a Yarn-specific issue that was fixed in npm 7 and npm 8.

Hey @fregante - the behavior you describe is perfectly intended. It's how peer dependencies have worked for the past 6 years, and there is no plan to change that.

Note that while npm 7+ does happen to auto-install peer dependencies, it's a non-standard behaviour that both Yarn and pnpm have expressed concerns against back when it was still in rfc period (lots of comments explaining why, I invite you to dig if you're curious); while our comments were largely ignored, our position still stands: we don't think this change is beneficial to the ecosystem (it may be handful in a couple of case, but very disruptive in many others), so we won't implement it as-is.

There is a simple portable fix, which is to mark webpack as an optional peer dependency (essentially #678). This is supported by both Yarn, pnpm, and npm.

[fregante]

Hey @fregante - the behavior you describe is perfectly intended

I'm not here to argue about that, you made the choice and your users deal with them.

There is a simple portable fix, which is to mark webpack as an optional peer dependency (essentially #678). This is supported by both Yarn, pnpm, and npm.

That does not seem to be the case:

yarn add https://github.com/flying-sheep/xo.git#webpack-peer-dep
yarn add v1.22.19
info No lockfile found.
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
warning "https://github.com/flying-sheep/xo.git#webpack-peer-dep > eslint-import-resolver-webpack@0.13.2" has unmet peer dependency "webpack@>=1.11.0".
warning "xo@0.51.0" is missing a bundled dependency "@typescript-eslint/eslint-plugin". This should be reported to the package maintainer.
warning "xo@0.51.0" is missing a bundled dependency "@typescript-eslint/parser". This should be reported to the package maintainer.
warning "xo@0.51.0" is missing a bundled dependency "eslint-config-xo-typescript". This should be reported to the package maintainer.
[4/4] Building fresh packages...
success Saved lockfile.
success Saved 253 new dependencies.
info Direct dependencies
└─ xo@0.51.0
info All dependencies
├─ @babel/code-frame@7.18.6
├─ @babel/helper-validator-identifier@7.18.6
├─ @babel/highlight@7.18.6
├─ @humanwhocodes/config-array@0.10.4
├─ @humanwhocodes/gitignore-to-minimatch@1.0.2
├─ @humanwhocodes/object-schema@1.2.1
├─ @nodelib/fs.scandir@2.1.5
├─ @nodelib/fs.stat@2.0.5
├─ @nodelib/fs.walk@1.2.8
├─ @types/eslint@7.29.0
├─ @types/estree@1.0.0
├─ @types/json-schema@7.0.11
├─ @types/json5@0.0.29
├─ @types/minimist@1.2.2
├─ @types/parse-json@4.0.0
├─ @typescript-eslint/eslint-plugin@5.33.0
├─ @typescript-eslint/parser@5.33.0
├─ @typescript-eslint/type-utils@5.33.0
├─ acorn-jsx@5.3.2
├─ acorn@8.8.0
├─ ajv@6.12.6
├─ ansi-escapes@4.3.2
├─ ansi-regex@5.0.1
├─ ansi-styles@4.3.0
├─ argparse@2.0.1
├─ array-find@1.0.0
├─ array-includes@3.1.5
├─ array-union@2.1.0
├─ array.prototype.flat@1.3.0
├─ arrify@3.0.0
├─ balanced-match@1.0.2
├─ brace-expansion@1.1.11
├─ braces@3.0.2
├─ builtin-modules@3.3.0
├─ builtins@5.0.1
├─ callsites@3.1.0
├─ camelcase-keys@7.0.2
├─ camelcase@6.3.0
├─ ci-info@3.3.2
├─ clean-regexp@1.0.0
├─ color-convert@2.0.1
├─ color-name@1.1.4
├─ commondir@1.0.1
├─ concat-map@0.0.1
├─ confusing-browser-globals@1.0.11
├─ cosmiconfig@7.0.1
├─ cross-spawn@7.0.3
├─ decamelize-keys@1.1.0
├─ decamelize@5.0.1
├─ deep-is@0.1.4
├─ define-lazy-prop@3.0.0
├─ doctrine@2.1.0
├─ emoji-regex@8.0.0
├─ enhance-visitors@1.0.0
├─ enhanced-resolve@0.9.1
├─ env-editor@1.1.0
├─ error-ex@1.3.2
├─ es-shim-unscopables@1.0.0
├─ es-to-primitive@1.2.1
├─ eslint-config-prettier@8.5.0
├─ eslint-config-xo-typescript@0.51.1
├─ eslint-config-xo@0.41.0
├─ eslint-formatter-pretty@4.1.0
├─ eslint-import-resolver-node@0.3.6
├─ eslint-import-resolver-webpack@0.13.2
├─ eslint-module-utils@2.7.3
├─ eslint-plugin-ava@13.2.0
├─ eslint-plugin-es@4.1.0
├─ eslint-plugin-eslint-comments@3.2.0
├─ eslint-plugin-import@2.26.0
├─ eslint-plugin-n@15.2.4
├─ eslint-plugin-no-use-extend-native@0.5.0
├─ eslint-plugin-prettier@4.2.1
├─ eslint-plugin-unicorn@42.0.0
├─ eslint-rule-docs@1.1.235
├─ eslint-scope@7.1.1
├─ eslint@8.21.0
├─ esm-utils@4.0.0
├─ espree@9.3.3
├─ espurify@2.1.1
├─ execa@5.1.1
├─ fast-deep-equal@3.1.3
├─ fast-diff@1.2.0
├─ fast-glob@3.2.11
├─ fast-json-stable-stringify@2.1.0
├─ fast-levenshtein@2.0.6
├─ fastq@1.13.0
├─ file-entry-cache@6.0.1
├─ fill-range@7.0.1
├─ find-cache-dir@3.3.2
├─ find-root@1.1.0
├─ flat-cache@3.0.4
├─ flatted@3.2.6
├─ fs.realpath@1.0.0
├─ function.prototype.name@1.1.5
├─ get-set-props@0.1.0
├─ get-stdin@9.0.0
├─ get-stream@6.0.1
├─ get-symbol-description@1.0.0
├─ glob-parent@5.1.2
├─ glob@7.2.3
├─ graceful-fs@4.2.10
├─ grapheme-splitter@1.0.4
├─ hard-rejection@2.1.0
├─ has-bigints@1.0.2
├─ hosted-git-info@4.1.0
├─ human-signals@2.1.0
├─ import-fresh@3.3.0
├─ import-meta-resolve@1.1.1
├─ import-modules@2.1.0
├─ indent-string@4.0.0
├─ inflight@1.0.6
├─ inherits@2.0.4
├─ internal-slot@1.0.3
├─ interpret@1.4.0
├─ irregular-plurals@3.3.0
├─ is-absolute@1.0.0
├─ is-arrayish@0.2.1
├─ is-bigint@1.0.4
├─ is-boolean-object@1.1.2
├─ is-builtin-module@3.2.0
├─ is-callable@1.2.4
├─ is-core-module@2.10.0
├─ is-date-object@1.0.5
├─ is-docker@2.2.1
├─ is-extglob@2.1.1
├─ is-fullwidth-code-point@3.0.0
├─ is-get-set-prop@1.0.0
├─ is-glob@4.0.3
├─ is-js-type@2.0.0
├─ is-negated-glob@1.0.0
├─ is-negative-zero@2.0.2
├─ is-number-object@1.0.7
├─ is-number@7.0.0
├─ is-obj-prop@1.0.0
├─ is-plain-obj@1.1.0
├─ is-proto-prop@2.0.0
├─ is-relative@1.0.0
├─ is-shared-array-buffer@1.0.2
├─ is-stream@2.0.1
├─ is-string@1.0.7
├─ is-symbol@1.0.4
├─ is-unc-path@1.0.0
├─ is-unicode-supported@0.1.0
├─ is-weakref@1.0.2
├─ is-windows@1.0.2
├─ is-wsl@2.2.0
├─ isexe@2.0.0
├─ js-tokens@4.0.0
├─ js-types@1.0.0
├─ json-parse-even-better-errors@2.3.1
├─ json-schema-traverse@0.4.1
├─ json5@2.2.1
├─ kind-of@6.0.3
├─ line-column-path@3.0.0
├─ lines-and-columns@1.2.4
├─ locate-path@6.0.0
├─ lodash-es@4.17.21
├─ lodash.merge@4.6.2
├─ lodash@4.17.21
├─ log-symbols@4.1.0
├─ make-dir@3.1.0
├─ map-obj@1.0.1
├─ memory-fs@0.2.0
├─ meow@10.1.3
├─ merge-stream@2.0.0
├─ merge2@1.4.1
├─ micro-spelling-correcter@1.1.1
├─ micromatch@4.0.5
├─ mimic-fn@2.1.0
├─ min-indent@1.0.1
├─ minimatch@3.1.2
├─ minimist-options@4.1.0
├─ minimist@1.2.6
├─ ms@2.1.2
├─ natural-compare@1.4.0
├─ npm-run-path@4.0.1
├─ obj-props@1.4.0
├─ object-inspect@1.12.2
├─ object.assign@4.1.3
├─ object.values@1.1.5
├─ onetime@5.1.2
├─ open-editor@4.0.0
├─ open@8.4.0
├─ optionator@0.9.1
├─ p-limit@3.1.0
├─ p-locate@5.0.0
├─ p-try@1.0.0
├─ parent-module@1.0.1
├─ parse-json@5.2.0
├─ path-is-absolute@1.0.1
├─ path-key@3.1.1
├─ path-parse@1.0.7
├─ picomatch@2.3.1
├─ pkg-dir@4.2.0
├─ plur@4.0.0
├─ pluralize@8.0.0
├─ prettier-linter-helpers@1.0.0
├─ prettier@2.7.1
├─ proto-props@2.0.0
├─ punycode@2.1.1
├─ queue-microtask@1.2.3
├─ quick-lru@5.1.1
├─ read-pkg-up@7.0.1
├─ read-pkg@5.2.0
├─ redent@4.0.0
├─ regexp-tree@0.1.24
├─ regexp.prototype.flags@1.4.3
├─ regexpp@3.2.0
├─ resolve-from@5.0.0
├─ resolve@1.22.1
├─ reusify@1.0.4
├─ rimraf@3.0.2
├─ run-parallel@1.2.0
├─ safe-regex@2.1.1
├─ shebang-command@2.0.0
├─ shebang-regex@3.0.0
├─ side-channel@1.0.4
├─ signal-exit@3.0.7
├─ spdx-correct@3.1.1
├─ spdx-exceptions@2.3.0
├─ string-width@4.2.3
├─ string.prototype.trimend@1.0.5
├─ string.prototype.trimstart@1.0.5
├─ strip-bom@3.0.0
├─ strip-final-newline@2.0.0
├─ strip-indent@3.0.0
├─ strip-json-comments@3.1.1
├─ supports-color@7.2.0
├─ supports-hyperlinks@2.2.0
├─ supports-preserve-symlinks-flag@1.0.0
├─ tapable@0.1.10
├─ text-table@0.2.0
├─ to-absolute-glob@2.0.2
├─ to-regex-range@5.0.1
├─ trim-newlines@4.0.2
├─ tsconfig-paths@3.14.1
├─ tslib@1.14.1
├─ type-check@0.4.0
├─ typescript@4.7.4
├─ unbox-primitive@1.0.2
├─ unc-path-regex@0.1.2
├─ uri-js@4.4.1
├─ url-or-path@2.1.0
├─ v8-compile-cache@2.3.0
├─ which-boxed-primitive@1.0.2
├─ which@2.0.2
├─ word-wrap@1.2.3
├─ xo@0.51.0
├─ yallist@4.0.0
├─ yaml@1.10.2
├─ yargs-parser@20.2.9
└─ yocto-queue@0.1.0
Done in 10.95s.

Live run at:

https://github.com/fregante/sandbox/runs/7764563532?check_suite_focus=true

[flying-sheep]

That’s yarn 1, with yarn 2 and the changes from my PR, everything seems to be in order:

$ mkdir repro-yarn2-xo-peerdep
$ cd repro-yarn2-xo-peerdep
$ yarn init -2
➤ YN0000: Retrieving https://repo.yarnpkg.com/3.2.2/packages/yarnpkg-cli/bin/yarn.js
➤ YN0000: Saving the new release in .yarn/releases/yarn-3.2.2.cjs
➤ YN0000: Done in 0s 434ms
{
  name: 'repro-yarn2-xo-peerdep',
  packageManager: 'yarn@3.2.2'
}
$ yarn add 'xo@https://github.com/flying-sheep/xo.git#webpack-peer-dep'
➤ YN0000: ┌ Resolution step
➤ YN0013: │ xo@https://github.com/flying-sheep/xo.git#commit=fbb192efb71dbb17655dafa851f3136a397c6cc5 can't be found in the cache and will be fetched from GitHub
➤ YN0000: └ Completed in 16s 459ms
➤ YN0000: ┌ Fetch step
➤ YN0013: │ yallist@npm:4.0.0 can't be found in the cache and will be fetched from the remote registry
➤ YN0013: │ yaml@npm:1.10.2 can't be found in the cache and will be fetched from the remote registry
➤ YN0013: │ yargs-parser@npm:20.2.9 can't be found in the cache and will be fetched from the remote registry
➤ YN0013: │ yocto-queue@npm:0.1.0 can't be found in the cache and will be fetched from the remote registry
➤ YN0013: │ yocto-queue@npm:1.0.0 can't be found in the cache and will be fetched from the remote registry
➤ YN0000: └ Completed in 0s 539ms
➤ YN0000: ┌ Link step
➤ YN0000: │ ESM support for PnP uses the experimental loader API and is therefore experimental
➤ YN0000: └ Completed in 0s 215ms
➤ YN0000: Done with warnings in 17s 278ms

[fregante]

So you are agreeing that the issue cannot be fixed in Yarn 1, which is what most users are using. 👍

I'll leave further decisions to other maintainers, no more @ pings for me.

[flying-sheep]

I can’t speak for yarn 1, the maintainers should chime in about that one.

What about merging #678? It’ll fix xo’s metadata as far as yarn 2 is concerned and is clearly more correct than what’s currently there.

[qyurila]

Same goes with pnpm:

> pnpm add xo -D
Packages: +244
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Progress: resolved 772, reused 730, downloaded 0, added 0, done

devDependencies:
+ xo 0.52.3

 WARN  Issues with peer dependencies found
.
└─┬ xo 0.52.3
  └─┬ eslint-import-resolver-webpack 0.13.2
    └── ✕ missing peer webpack@>=1.11.0
Peer dependencies that should be installed:
  webpack@>=1.11.0

but #678 does not fix the issue. Adding webpack as optional peer dependency does not suppress the warning from eslint-import-resolver-webpack:

> pnpm add 'xo@https://github.com/flying-sheep/xo.git#webpack-peer-dep' -D
Packages: +257
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Progress: resolved 785, reused 742, downloaded 1, added 3, done

devDependencies:
+ xo 0.51.0

 WARN  Issues with peer dependencies found
.
└─┬ xo 0.51.0
  ├── ✕ missing peer webpack@>=1.11.0
  └─┬ eslint-import-resolver-webpack 0.13.2
    └── ✕ missing peer webpack@>=1.11.0
Peer dependencies that should be installed:
  webpack@>=1.11.0

---

On the other hand, pnpm supports a config option for ignoring specific peer dependencies, so the issue is not much a problem as yarn. Maybe it might be a good idea to mention the issue and the workaround on README.md or somewhere.

// package.json
{
  "pnpm": {
    "peerDependencyRules": {
      "ignoreMissing": ["webpack"]
    }
  }
}