Incorrect mapbox-gl peer dependency range (npm7 workspaces)

[dschnare]

{
  "peerDependencies": {
    "mapbox-gl": "^0.41.0 <2.0.0"
  }
}

This semver range computes to >=0.41.0 <0.42.0-0 <2.0.0.
This range can only be satisfied with mapbox-gl versions >= 0.41.0 < 0.42.0.

This becomes a problem when using npm 7.x and workspaces.

Suggested fix is to change the semver range for the mapbox-gl peer dependency to 0.41.0 <2.0.0, this will allow mapbox-gl any version below 2.0.0 and above or equal to 0.41.0 to meet the peer dependency which I believe was the original intention.

[dschnare]

After review of my suggested change, I believe the range should be this >=0.41.0 <2.0.0.

[chingiz19]

I have the same issue, let me know if there is a "hacky" solution for the time being

[sezf-opscentral]

This wasn't a problem for us until our CI/CD pipeline upgraded to Node 16.15.1 & npm 8.11.0 now we see this error during npm install:

npm ERR! While resolving: @mapbox/mapbox-gl-directions@4.1.0
npm ERR! Found: mapbox-gl@1.13.2
npm ERR! node_modules/mapbox-gl
npm ERR!   mapbox-gl@"^1.13.2" from the root project
npm ERR!   peer mapbox-gl@">=0.32.1 <2.0.0" from @mapbox/mapbox-gl-supported@1.5.0
npm ERR!   node_modules/@mapbox/mapbox-gl-supported
npm ERR!     @mapbox/mapbox-gl-supported@"^1.5.0" from mapbox-gl@1.13.2
npm ERR!   1 more (ngx-mapbox-gl)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer mapbox-gl@"^0.41.0 <2.0.0" from @mapbox/mapbox-gl-directions@4.1.0
npm ERR! node_modules/@mapbox/mapbox-gl-directions
npm ERR!   @mapbox/mapbox-gl-directions@"^4.1.0" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: mapbox-gl@0.41.0
npm ERR! node_modules/mapbox-gl
npm ERR!   peer mapbox-gl@"^0.41.0 <2.0.0" from @mapbox/mapbox-gl-directions@4.1.0
npm ERR!   node_modules/@mapbox/mapbox-gl-directions
npm ERR!     @mapbox/mapbox-gl-directions@"^4.1.0" from the root project

[dmenisdev]

Example on mapbox website shows mapbox-gl 2.8.2 working together with mapbox-gl-directions 4.1.0

A work-around solution for when you use NPM version > 7 is to run npm install with the --legacy-peer-deps flag
It seems that the new NPM version has a stricter policy when it comes to peer dependencies.

[rogadev]

Still having this problem today:

$ npm i @mapbox/mapbox-gl-directions
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: undefined@undefined
npm ERR! Found: mapbox-gl@2.10.0
npm ERR! node_modules/mapbox-gl
npm ERR!   mapbox-gl@"^2.10.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer mapbox-gl@"^0.41.0 <2.0.0" from @mapbox/mapbox-gl-directions@4.1.0
npm ERR! node_modules/@mapbox/mapbox-gl-directions
npm ERR!   @mapbox/mapbox-gl-directions@"*" 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\ryanr\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\ryanr\AppData\Local\npm-cache\_logs\2022-10-31T21_13_30_240Z-debug-0.log

Does install with --legacy-peer-deps but this is almost certainly less than ideal. It's also worth noting that there is still nothing mentioned about this issue in the navigation docs, or on npmjs.com, or general Mapbox docs, as far as I could find. Maybe updates are needed?

These places would be good places to bring attention to the issue:
Docs
NPM

[rogadev]

I spoke too soon. It installs without the above error tree, but doesn't seem to be there when I attempt to import it.

import MapboxDirections from "@mapbox/mapbox-gl-directions";

Cannot find module '@mapbox/mapbox-gl-directions' or its corresponding type declarations.ts(2307)

[Tepepaz]

Currently, it does install with --legacy-peer-deps but then it throws an error when launching the app.

error - ./node_modules/@mapbox/mapbox-gl-directions/src/controls/inputs.js:6:0
Module not found: Can't resolve 'fs'

Import trace for requested module:
./node_modules/@mapbox/mapbox-gl-directions/src/directions.js
./node_modules/@mapbox/mapbox-gl-directions/src/index.js

[kennydurkin]

A recent update to package.json seems to finally address this in the #298 changeset.

Seems like we're now just waiting for them to publish a new version to NPM? cc @chriswhong

[collier-watkins]

@chriswhong Any updates on this issue?

[snsd0805yoona]

Any update on this? @rogadev How do you solve this?

[Vlad-Vasinev]

Yep, i also faced with this problem "Cannot find module '@mapbox/mapbox-gl-directions'", any suggestions?

[makosdanii]

@chriswhong Could you please tell me if there's a solution, or update upcoming? I would use the navigation package for a school project and the deadline is coming :D

[gerardo-rodriguez]

Hello, I'm curious about updates on this issue as well. Thank you! 🙂

---

Update: I installed successfully with the --legacy-peer-deps flag, but I then also get an fs app error:

Uncaught TypeError: fs.readFileSync is not a function

It seems to come from the inputs.js file:

let fs = require('fs'); // substack/brfs#39
let tmpl = template(fs.readFileSync(__dirname + '/../templates/inputs.html', 'utf8'));

---

Update: This worked for me to get around this issue: #261 (comment)