expandUrl Bug in v11

[nehalist]

Hey there again,

we've switched our package manager from npm to pnpm, and since then the bug fixed in 12.4.0 ("Fix issue with missing expandUrl from OpenLayers") is currently causing some real issues:

No matching export in "../../node_modules/.pnpm/ol@10.9.0/node_modules/ol/tileurlfunction.js" for import "expandUrl"

The problem is that I can't upgrade to >11 since our map stops rendering correctly then. I'm not entirely sure why, but I also don't want to touch our map just because we switch package manager.

Since I haven't found any suitable fix within Vite, would it be possible to release a 11.0.4 with a fix for expandUrl? I'd be happy to open a PR for that.

Thanks a lot and cheers!

P.S. Schöne Grüße aus und nach Graz :)

[ahocevar]

We don't have a good process for backports really, so that would be the last resort. I suspect that ol-mapbox-style or ol are not deduped properly by pnpm. I'm not familiar with pnpm, but in npm I would do npm ls ol-mapbox-style and npm ls ol to see if multiple versions are returned, and use npm dedupe ol or npm dedupe ol-mapbox-style to resolve that. Because of instanceof checks and the such, applications with multiple versions of the same dependency are always problematic. So you should try to resolve the dependency to have both ol-mapbox-style and ol deduped.

P.S. Schöne Grüße aus und nach Graz :)

👋

[nehalist]

I tried checking out the ol-mapbox-style repository directly, switch to v11.0.3 and run

rm package-lock.json
pnpm i

And already these commands fail due to

src/util.js:1:9 - error TS2305: Module '"ol/tileurlfunction.js"' has no exported member 'expandUrl'.

and a bunch of other errors. dedupe also doesn't do anything useful, unfortunately. Any other idea?

[nehalist]

Okay, seems like I've found a workaround;

within my vite config I've added an alias

resolve: {
    alias: {
      "@": path.resolve(__dirname, "./src"),
      "ol/tileurlfunction.js": path.resolve(
        __dirname,
        "./shim/tileurlfunction.js"
      ),
    },
  },

Which now resolves imports from ol/tileurlfunction.js to my local tileurlfunction.js function - which is simply just:

export * from "ol/tileurlfunction.js";

export function expandUrl(...args) {
  return args;
}

This seems fine for now, but I have to do some further testing. Would you see any issue with that approach?

e/ Updated the shim impl.

[ahocevar]

If you could provide a minimal repo with the setup that causes this error, I can take a look. I'd be interested in understanding what's going on here.

[nehalist]

Sure thing.

https://github.com/nehalist/ol-mapbox-style-bug

Installing deps via pnpm i works fine, but pnpm dev fails with the exact same error. I do import applyStyle within App.tsx.

[MISSING_EXPORT] Error: "expandUrl" is not exported by "node_modules/.pnpm/ol@10.9.0/node_modules/ol/tileurlfunction.js".
   ╭─[ node_modules/.pnpm/ol-mapbox-style@11.0.3_ol@10.9.0/node_modules/ol-mapbox-style/dist/index.js:9:10 ]

[ahocevar]

Ok, so what happened is this: pnpm brought in a newer version of ol, which is not compatible with ol-mapbox-style@11. Like the ol-mapbox-style readme says:

ol-mapbox-style >=12.4 is required for OpenLayers >10.3.1.

you have to go back to an older version of ol too:

pnpm i ol@10.3.1

To figure out why your map stopped rendering with ol-mapbox-style@latest, check the release notes of ol-mapbox-style, especially https://github.com/openlayers/ol-mapbox-style/releases/tag/v12.0.0 and https://github.com/openlayers/ol-mapbox-style/releases/tag/v13.0.0. There were only a few backwards incompatible changes, so you should be able to adjust your code accordingly without too much effort.