Skip to content

Turbopack dev server drops MapLibre inline worker (react-map-gl clusters, tilelayers never render) #86495

@Dendekky

Description

@Dendekky

Link to the code that reproduces this issue

https://github.com/Dendekky/react-map-gl-turbopack-issue-repro

To Reproduce

  1. Create a Next.js 15.5.1-canary project with App Router + React 19.
  2. Install [email protected] and [email protected].
  3. Render the component below anywhere in the app:
<Map>
  <Source
    id="earthquakes"
    type="geojson"
    data="https://maplibre.org/maplibre-gl-js/docs/assets/earthquakes.geojson"
    cluster
    clusterMaxZoom={14}
    clusterRadius={50}
  >
    <Layer id="clusters" type="circle" source="earthquakes" filter={['has', 'point_count']} />
    <Layer id="cluster-count" type="symbol" source="earthquakes" filter={['has', 'point_count']} />
    <Layer id="unclustered" type="circle" source="earthquakes" filter={['!', ['has', 'point_count']]} />
  </Source>
</Map>
  1. Run next dev --turbo.

Current vs. Expected behavior

Current:
No data renders; the map stays empty.
Turbopack repeatedly prints Error: unrecognized HMR message {"event":"ping"} then hot-reloads.
No browser console errors.
If you run next dev (without --turbo), or if you build and start with webpack, the map works.

Expected:
react-map-gl should behave the same under Turbopack as it does under webpack (MapLibre’s worker spins up, clusters render).

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 24.4.0: Fri Apr 11 18:33:40 PDT 2025; root:xnu-11417.101.15~117/RELEASE_ARM64_T6031
  Available memory (MB): 49152
  Available CPU cores: 16
Binaries:
  Node: 24.9.0
  npm: 11.6.0
  Yarn: 1.22.22
  pnpm: N/A
Relevant Packages:
  next: 15.5.1-canary.20
  eslint-config-next: 15.5.1-canary.20
  react: 19.1.0
  react-dom: 19.1.0
  typescript: 5.9.2
Next.js Config:
  output: standalone

Which area(s) are affected? (Select all that apply)

Turbopack

Which stage(s) are affected? (Select all that apply)

next dev (local)

Additional context

The error appears right when MapLibre sends the worker “ping” message used for dev HMR—Turbopack doesn’t recognize it and tears down the worker.
Removing --turbo or disabling Turbopack via TURBOPACK=0 makes the exact same code work without changes.
Using next dev --turbo with Next.js 15.5.1-canary + React 19 + [email protected] (MapLibre backend) causes MapLibre’s clustering worker to never start. The same component works fine with next dev (webpack) or in production as long as transpilePackages includes maplibre-gl.

Metadata

Metadata

Assignees

No one assigned

    Labels

    TurbopackRelated to Turbopack with Next.js.

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions