4

我正在尝试在我的新 ClojureScript 和Reagent应用程序中使用react-beautiful-dnd 。根据这里的博客,它说我需要在我的文件中包含使用的文件。:foreign-libsproject.clj

我已将其配置如下

  :cljsbuild
  {:builds {:min
            {:source-paths ["src/cljs" "src/cljc" "env/prod/cljs"]
             :compiler
             {:output-to        "target/cljsbuild/public/js/app.js"
              :output-dir       "target/cljsbuild/public/js"
              :source-map       "target/cljsbuild/public/js/app.js.map"
              :optimizations :advanced
              :foreign-libs [{:file "src/cljs/react-beautiful-dnd/react-beautiful-dnd.js"}]
              :pretty-print  false}}
            :app
            {:source-paths ["src/cljs" "src/cljc" "env/dev/cljs"]
             :figwheel {:on-jsload "toka.core/mount-root"}
             :compiler
             {:main "toka.dev"
              :asset-path "/js/out"
              :output-to "target/cljsbuild/public/js/app.js"
              :output-dir "target/cljsbuild/public/js/out"
              :source-map true
              :optimizations :none
              :pretty-print  true}}



            }
   }

我从这里得到了我在我的项目中复制的编译文件。尽管经过所有这些更改,我仍然无法使用DragDropContextDroppable在我的组件中。

在我的组件中,我已将它们声明如下

(def DragDropContext (reagent/adapt-react-class js/DragDropContext))
(def Droppable (reagent/adapt-react-class js/Droppable))

谁能帮我理解我在这里做错了什么?我收到如下错误

Uncaught ReferenceError: DragDropContext is not defined
    at core.cljs?rel=1508832729388:11
(anonymous) @ core.cljs?rel=1508832729388:11

注意:我没有添加任何provide属性,foreign-libs因为我不确定包。另外我不确定是否需要:require在我的core.cljs组件文件中做一些事情。

4

2 回答 2

2

我正在努力解决同样的问题并找到了解决方案。这些组件被放在一个单独的命名空间中,因此必须像这样引用:

(def DragDropContext (reagent/adapt-react-class js/ReactBeautifulDnd.DragDropContext))
(def Droppable (reagent/adapt-react-class js/ReactBeautifulDnd.Draggable))
于 2018-02-27T20:40:32.810 回答
1

您需要添加:provides(您可以选择任何您想要的 ns 名称,例如react-beautiful-dnd),然后添加require它以便加载。因为它依赖于 React,你应该在中指定它requires(例如cljsjs.react,如果你将 React 包含为 CLJSJS 依赖项):

[{:file "src/cljs/react-beautiful-dnd/react-beautiful-dnd.js"
  :provides ["react-beautiful-dnd"]
  :requires ["cljsjs.react"]}]

在您的命名空间中:

(ns my.ns
  (:require
    [cljsjs.react]
    [react-beautiful-dnd]))
于 2017-10-24T09:12:21.213 回答