CODEWITHSUNDEEP
javascriptreactjsmapbox-glreact-map-gl
Tanvesh
Tanvesh

Reputation: 125

Error: An API access token is required to use Mapbox GL

I am using react-gl library to use the map-api using mapbox. I have created an account mapbox as well still it is showing the error depicted in the picture.

Here is my code for app.js




import * as React from 'react';
import Map from 'react-map-gl';

function App() {
  return (
    <Map
      initialViewState={{
        longitude: -122.4,
        latitude: 37.8,
        zoom: 14
      }}
      mapboxApiAccessToken = {process.env.REACT_APP_MAPBOX}
      style={{width: 600, height: 400}}
      mapStyle="mapbox://styles/mapbox/streets-v9"
    />
  );
}

export default App

Here is the error: enter image description here

Here is my error in vscode

Upvotes: 1

Views: 4268

Answers (2)

Wani
Wani

Reputation: 496

Big shout out to Dani Pérez. Apparently his answer is correct. Just to add on to his answer, in react-map-gl v7.0, they decided to rename various props and one of those props is mapboxApiAccessToken

Renamed props for better consistency with the wrapped library:

  • mapboxApiAccessToken is now mapboxAccessToken

This is mentioned in their Upgrade guide: https://visgl.github.io/react-map-gl/docs/upgrade-guide

Upvotes: 2

Dani P&#233;rez
Dani P&#233;rez

Reputation: 114

I faced the same problem. You must to change mapboxApiAccessToken to mapboxAccessToken.

Upvotes: 9

Related Questions