search

googlemaps / js-markerclusterer

Create and manage clusters for large amounts of markers
https://googlemaps.github.io/js-markerclusterer/
Apache License 2.0
234 stars 87 forks source link

Correct exports of the module for better module loading compatibility with node.js #908

Open trygve-lie opened 3 months ago

trygve-lie commented 3 months ago

Is your feature request related to a problem? Please describe.

This module exports a UMD module in the main field and it provides an ESM version through the module field in package.json. Node.js supports mixing CJS and ESM modules these days but this setup does not go well with using this module in node.js.

The module field are only used by bundlers. Its not supported by node.js. So when trying to use this module with node.js without bundling it will try to load the file references in the main field which is a UMD file that node.js does not understand either.

Iow; how the ESM version is exposed in this module is wrong according to node.js.

My problem with this is that this breaks SSR of Lit web components (I am using this module in a Lit web component) and it also breaks SSR in Nuxt it seems like. Using this module with Lit SSR is possible if it only where exported correctly.

Describe the solution you'd like

Set package.json to type: module and export the ESM as recommended by node.js: https://nodejs.org/api/packages.html#dual-commonjses-module-packages

Basically add:

  "type": "module",
  "exports": {
    "import": "./dist/index.esm.js",
    "require": "./dist/index.umd.js"
  },

Describe alternatives you've considered

I don't think there is an alternative way of doing this.

renaudcollet commented 4 hours ago

I import the package like this, so I can build and preview my Nuxt project : import * as MarkerClustererPackage from '@googlemaps/markerclusterer'; let markerCluster: MarkerClustererPackage.MarkerClusterer = new MarkerClustererPackage.MarkerClusterer({...});