Leaflet React Markercluster - 包在 ClojureScript 中不起作用

Question

我想为 Leaflet 使用集群插件。因为我使用的是 ClojureScript，所以我想我需要一个 React 实现。我已经在 npm 上尝试了所有可用的包。它们都在某一时刻失败，有时 bable 会抛出错误或发生一些意外的 EOF。

如果对于某些包，我能够使用 shadow-cljs 编译我的应用程序，我在浏览器控制台中收到以下错误（对于这个例子，我使用了 greenatoms 版本@greenatom/react-leaflet-markercluster）：

Uncaught Error: Assert failed: Invalid Hiccup form: [nil]
 (in map_runes.views.main_panel)
(valid-tag? tag)

源于

(def MarkerClusterGroup (r/adapt-react-class react-leaflet-cluster/MarkerClusterGroup))

我的要求是这样的：

(:require
   [reagent.core :as r]
   [re-frame.core :as re-frame]
   [leaflet :as leaflet]
   [react-leaflet :as react-leaflet]
   ["@greenatom/react-leaflet-markercluster" :as react-leaflet-cluster]
   [react-leaflet-heatmap-layer-v3 :as react-leaflet-heatmap])

我通过 npm 安装了包。我的

package.json

长这样：

"dependencies": {
        "@greenatom/react-leaflet-markercluster": "^3.0.0-rc4",
        "highlight.js": "11.1.0",
        "leaflet": "^1.7.1",
        "react": "^17.0.2",
        "react-dom": "^17.0.2",
        "react-leaflet": "^3.2.2",
        "react-leaflet-heatmap-layer-v3": "^3.0.3-beta-1"
    },

我错过了什么？所有的包裹都坏了还是我做错了什么？ 如果我可以使用 ClojureScript 以任何其他方式处理此任务，我也会很高兴。目前我想像这样使用 Cluster 函数将 Marker 包装在我的地图中：

[(if (= display-option :cluster) MarkerClusterGroup LayerGroup)
    [Marker]
    ;Here are multiple markers which are displayed normally if display-option is not cluster
]

Answer 1

看起来包正在使用“默认”导出，这在 JS 中具有特殊含义。

从官方包的示例中取出代码行并将其翻译成CLJS：

import MarkerClusterGroup from 'react-leaflet-cluster'

这确实NOT翻译成

(:require
  ["@greenatom/react-leaflet-markercluster" :as react-leaflet-cluster])
;; and
(def MarkerClusterGroup (r/adapt-react-class react-leaflet-cluster/MarkerClusterGroup))
;; or specifically 
react-leaflet-cluster/MarkerClusterGroup

它确实翻译成

(:require
  ["react-leaflet-markercluster$default" :as MarkerClusterGroup])
;; and then just using this in reagent hiccup
[:> MarkerClusterGroup ...]

这就是所有记录的例子。我怀疑您只是尝试了一堆不起作用的变体。也不要在 npm 上尝试随机包，坚持官方变体。人们经常将“分叉”版本放到网上，但之后不更新它。您选择的版本似乎已过时。