Uncaught TypeError: _arc2.default.GreatCircle не является конструктором

Question

Попытка создать плагин для Reaction-листовки. Я получаю эту ошибку, пока возвращаюсь

L.Polyline.Arc(position.from, position.to, опция)

Это мой компонент

import React, { PropTypes } from 'react';
import { Path } from 'react-leaflet';
import L from 'leaflet'
import { Arc } from './leaflet.arc';


export default class ArcLine extends Path {
  static propTypes = {
    children: PropTypes.oneOfType([
      PropTypes.arrayOf(PropTypes.node),
      PropTypes.node,
    ]),
    option:PropTypes.object,
    position: PropTypes.object.isRequired
  };

  createLeafletElement (props) {
    const { position, option, ...options } = props
    return L.Polyline.Arc(position.from, position.to, option)
  }

  updateLeafletElement (fromProps, toProps) {
    if (toProps.position !== fromProps.position) {
      this.leafletElement._createLatLngs(line, toProps.position.from)
    }
    this.setStyleIfChanged(fromProps, toProps)
  }
}

./leaflet.arc is

import arc from 'arc';
/**
 * Transform L.LatLng to {x, y} object
 * @param {L.LatLng} latlng
 * @returns {{x: {number}, y: {number}}}
 * @private
 */
const _latLngToXY = latlng => ({
    x: latlng.lng,
    y: latlng.lat
});

/**
 * Create array of L.LatLng objects from line produced by arc.js
 * @param {object} line
 * @param {L.LatLng} from
 * @private
 * @returns {Array}
 */
function _createLatLngs(line, from) {
    if (line.geometries[0] && line.geometries[0].coords[0]) {
        /**
         * stores how many times arc is broken over 180 longitude
         * @type {number}
         */
        let wrap = from.lng - line.geometries[0].coords[0][0] - 360;

        return line.geometries
            .map(subLine => {
                wrap += 360;
                return subLine.coords.map(point => L.latLng([point[1], point[0] + wrap]));
            })
            .reduce((all, latlngs) => all.concat(latlngs));
    } else {
        return [];
    }
}

if (!L) {
    throw "Leaflet.js not included";
}  else if (!arc && !arc.GreatCircle) {
    throw "arc.js not included";
} else {
    L.Polyline.Arc = function (from, to, options) {
        from = L.latLng(from);
        to = L.latLng(to);
debugger

        var vertices = 10;
        var arcOptions = {};
        if (options) {
            if (options.offset) {
                arcOptions.offset = options.offset;
                delete options.offset;
            }
            if (options.vertices) {
                vertices = options.vertices;
                delete options.vertices;
            }
        }

        var generator = new arc.GreatCircle({x: from.lng, y: from.lat}, {x: to.lng, y: to.lat});

        var line = generator.Arc(vertices, arcOptions);
        var latLngs = [];

        var wrap = 0; // counts how many times arc is broken over 180 degree
        if (line.geometries[0] && line.geometries[0].coords[0])
            wrap = from.lng - line.geometries[0].coords[0][0];

        line.geometries.forEach(function(line) {
            line.coords.forEach(function (point) {
                latLngs.push(L.latLng(
                    [point[1], point[0] + wrap]
                ));
            });
            wrap += 360;
        });
        line.geometries[0].coords
        return L.polyline(latLngs, options);
    };
}

Почему я получаю эту ошибку, любое предложение?

Answer 1

В этой строке здесь:

import { Arc } from './leaflet.arc'

... вы пытаетесь импортировать переменную Arc из вашего leaflet.arc файл. Однако в вашем leaflet.arc Если файл не выглядит, как будто вы что-то экспортируете, просто присоединяете функцию Arc к объекту Leaflet Polyline. Кроме того, в коде в вашем компоненте вы даже не используете Arc переменная, которую вы пытаетесь импортировать. Итак, код завершается ошибкой, потому что свойство пытается быть прочитано из неопределенного экспорта из leaflet.arc, Похоже, что вам, вероятно, следует просто импортировать файл, не пытаясь импортировать какие-либо объекты.

TLDR:

Заменить эту строку:

import { Arc } from './leaflet.arc'

с этим:

import './leaflet.arc'