mapbox / mapbox/mapbox-gl-js

V3 Upgrade: An error occurred while parsing the WebWorker bundle

Open
#13,329 3 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

auto-triaged bug :lady_beetle:
Dominant language
TypeScript
Stars
12.4k
Forks
2.4k
PR merge metrics
No merged PRs in 30d

Description

**mapbox-gl-js version**: 3.8.0

**browser**: Chrome Version 130.0.6723.117

### Steps to Trigger Behavior

1. Upgrade to mapbox-gl v3
2. Run the application

### Link to Demonstration

https://jsbin.com/

Cannot easily provide a reproduction.

The application is a react app with webpack 4 and babel 8.

### Expected Behavior

It should render the map after following the V3 migration guide.

### Actual Behavior

An error occurred while parsing the WebWorker bundle

![Screenshot 2024-11-20 at 17 26 48](https://github.com/user-attachments/assets/490226c4-9f65-4b3f-856b-46b0da9b1fed)

This happens when importing with

```js
import mapboxgl from 'mapbox-gl'
```

If i import with previous transpilation suggestion i get another error.

```js
import mapboxgl from '!mapbox-gl'
```

```
./node_modules/mapbox-gl/dist/mapbox-gl.js 34:21870
Module parse failed: Unexpected token (34:21870)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
```

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the issue in a React application using webpack 4 and Babel 8, testing both `import mapboxgl from 'mapbox-gl'` and the `!mapbox-gl` form. Compare the resulting WebWorker bundle parse errors with the V3 migration guide; done means the map renders without a bundle parsing error.

Written by the indexing model from the issue text.

Assessment

Tech stack
babel, javascript, react, webpack
Domain
frontend, web-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.