Reaction-Map-GL-Can不会将环境变量传递给组件 [英] React-Map-GL - Can't pass environmental variable to component

问题描述

我使用react-map-gl将Mapbox集成到我的项目中。我的地图组件如下所示：

import * as React from 'react';
import { useState } from 'react';
import ReactMapGL from 'react-map-gl';

function Map() {
  const [viewport, setViewport] = useState({
    width: 400,
    height: 400,
    latitude: 37.7577,
    longitude: -122.4376,
    zoom: 8
  });

  return (
    <ReactMapGL
      {...viewport}
      mapboxApiAccessToken={process.env.REACT_APP_MAPBOX_KEY}
      onViewportChange={nextViewport => setViewport(nextViewport)}
    />
  );
}

export default Map;

我收到无令牌警告&并且我的地图不显示。如果我用实际的字符串键替换process.env.REACT_APP_MAPBOX_KEY，它工作得很好。为什么不能在.env文件中使用变量并将其传递给mapboxApiAccessToken？

在.env文件中，我的关键变量如下所示： REACT_APP_MAPBOX_KEY=此处的实际字符串

为什么此操作不起作用？

推荐答案

请勿使用Process.env它不适用于Reaction-Map-gl直接粘贴内标识它工作正常

这篇关于Reaction-Map-GL-Can不会将环境变量传递给组件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！