javascript - Error: An API access token is required to use Mapbox GL - Stack Overflow

admin管理员组

文章数量:1312778

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:

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:

• javascript
• reactjs
• mapbox-gl
• react-map-gl

Share Improve this question Follow edited Mar 25, 2022 at 5:10 Tanvesh asked Mar 25, 2022 at 5:05 TanveshTanvesh 12522 silver badges1414 bronze badges 5

• check your mapbox api token – Dharmik Patel Commented Mar 25, 2022 at 5:07
• Its correct , I have authenticated it as well! – Tanvesh Commented Mar 25, 2022 at 5:08
• check what the value of mapboxApiAccessToken is – Bravo Commented Mar 25, 2022 at 5:10
• what about if you use mapboxApiAccessToken="{process.env.REACT_APP_MAPBOX}" - check that process.env.REACT_APP_MAPBOX is correct – Bravo Commented Mar 25, 2022 at 5:11
• Still same issue :( – Tanvesh Commented Mar 25, 2022 at 5:14

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 9

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

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

本文标签： javascriptError An API access token is required to use Mapbox GLStack Overflow