visgl / loaders.gl

Loaders for big data visualization. Website:
https://loaders.gl
Other
702 stars 192 forks source link

Bundler workers are not exported from package anymore #3034

Open kouak opened 3 months ago

kouak commented 3 months ago

I'm using deck.gl with @loaders.gl/mvt for an internal app, in an offline/airgapped environment. Browsers are not connected to the internet and can't load the worker bundle from unpkg.com.

I used to import the worker bundle with a custom webpack config and the following statement :

// Deck.tsx
import mvtLoaderWorkerUrl from '@loaders.gl/mvt/dist/mvt-worker.js';

// webpack.config.ts
            {
              test: [/dist\/mvt-worker\.js$/],
              type: 'asset/resource',
              generator: {
                filename: 'mvt-worker.[hash].js',
              },
            }

For reference, here's a similar implementation with vite (no special config) :

import mvtLoaderWorkerUrl from '@loaders.gl/mvt/dist/mvt-worker.js?url';

With @loaders.gl/mvt v4.2.2, I'm encountering this error :

Module not found: Error: Package path ./dist/mvt-worker.js is not exported from package <appDir>/frontend/node_modules/@loaders.gl/mvt (see exports field in <appDir>/frontend/node_modules/@loaders.gl/mvt/package.json)

A workaround is to import the file via relative import

import mvtLoaderWorkerUrl from '../../../../node_modules/@loaders.gl/mvt/dist/mvt-worker.js';

I guess a solution would be to include the bundled worker.js file in the package.json#exports field:

{
 "exports": {
    ".": {
      "types": "./dist/index.d.ts",
      "import": "./dist/index.js",
      "require": "./dist/index.cjs"
    },
    "./dist/mvt-worker.js": {
      "import": "./dist/mvt-worker.js"
    }
  }
}

I'm currently having this issue with @loaders.gl/mvt because that's the one I'm using, but AFAIK, this issue should affect all other loaders.

ibgreen commented 3 months ago

Yes this seems like a side effect of introducting the "exports" section in package.json.

It would probably be OK to add an export field for the workers. Maybe even skip the dist?

`{ "exports": { ".": {...}, "./mvt-worker.js": { "import": "./dist/mvt-worker.js" } } }

Feel free to open a PR on the mvt module. We can do this module by module for now and do a pass on all modules once the idea is proven.