Erreur lors de l'utilisation de rea-map-gl dans create-react-app

Création d'une application simple pour essayer le React Map GL d'Uber en utilisant la configuration super simple Create React App. Voici une configuration simplifiée de ce que j'ai:Erreur lors de l'utilisation de rea-map-gl dans create-react-app

import React, { Component } from 'react' 
import MapGL from 'react-map-gl' 

class Home extends Component { 
    render() { 
    return (
     <MapGL 
     width={400} 
     height={400} 
     latitude={37.7577} 
     longitude={-122.4376} 
     zoom={8} 
     mapStyle="mapbox://styles/mapbox/dark-v9" 
     /> 
    } 
}

qui se traduit par une erreur de:

Uncaught TypeError: Cannot convert undefined or null to object 
    at Function.keys (<anonymous>) 
    at new module.exports (index.js:9) 
    at Object.<anonymous> (web_worker.js:5) 
    at __webpack_require__ (bootstrap e5da5fb…:555) 
    at fn (bootstrap e5da5fb…:86) 
    at Object.<anonymous> (worker_pool.js:4) 
    at __webpack_require__ (bootstrap e5da5fb…:555) 
    at fn (bootstrap e5da5fb…:86) 
    at Object.<anonymous> (global_worker_pool.js:2) 
    at __webpack_require__ (bootstrap e5da5fb…:555)

En regardant example app using webpack de Uber j'ai remarqué qu'ils utilisent le transform-loader?brfs-babel chargeur pour le fichier mapbox-gl.js. Avec l'application Create React, vous n'avez pas accès à la configuration de webpack car elle est contenue dans un autre paquet. La seule option semble donc d'exécuter npm run eject pour extraire les dépendances et la configuration de webpack dans le projet.

L'éjection est la seule option? Ou suis-je manquant un moyen de le faire dans une installation standard create-react-app?

Source

2017-04-11 Brett DeWoody

je pense que question est, 'mapStyle', il attendre un style' object' et ur passer un 'string', l'utiliser comme ceci: 'mapStyle = {mapboxStyle}', vérifiez le doc: https://github.com/uber/react-map-gl#transitions –

C'est ce que je pensais aussi, mais l'exemple de l'application Uber montre une 'chaîne' utilisée - https : //github.com/uber/react-map-gl/blob/master/examples/exhibit-webpack/app.js#L32 –

Pour le développement, ajoutez la propriété mapboxApiAccessToken.

Si vous êtes CRA, En production au fichier .env REACT_APP_MAPBOX_ACCESS_TOKEN environmen varilable. mapboxApiAccessToken = { 'process.env.REACT_APP_MAPBOX_ACCESS_TOKEN'} />

<MapGL 
     width={400} 
     height={400} 
     latitude={37.7577} 
     longitude={-122.4376} 
     zoom={8} 
     mapStyle="mapbox://styles/mapbox/dark-v9" 
     mapboxApiAccessToken={'your-access-toekn-goes-here'}/>

Source

2017-08-18 05:10:45 user3405462

Erreur lors de l'utilisation de rea-map-gl dans create-react-app

Répondre

Questions connexes