Fork me on GitHub

Hi, I got kinda a beginners question but I can't seem to figure this out. I'm trying to use a date-picker on my web-page. ( But it keeps giving me this error (the date-picker is inside an element called search-bar)

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `app.components.date_picker.date_picker`.
    in app.components.date_picker.date_picker (created by app.components.search_bar.search_bar)
This is the code for my date-picker:
  (:require [reagent.core :as r]
            [re-frame.core :as rf]
            [clojure.string :as str]
            ["react-date-picker" :refer [DatePicker]]))

(defn date-picker []
  (let [on-change (fn [d] ())
        value (js/Date.)]
    [:> DatePicker {:onChange on-change
                    :value value}]))


DatePicker is undefined, most likely. Probably because the :require vector is incorrect.


ok, thx ill check that 🙂


dont exactly see whats wrong about it :s


Just to make sure, put (js/console.log DatePicker) right after the ns form and see what it prints out. If you confirm that it's undefined, try replacing the require vector with ["react-date-picker" :as date-picker] and then check what date-picker contains and try to go from there. In the end, you might need use :as or :default (in case you're using shadow-cljs; something else otherwise).


using shadow-cljs indeed. Ill try it when I get home 🙂 thx


In this case, you should consult the table in this section: Do note that it might be wrong in rare cases, so when it doubt just log the :as require to figure out what to use.


Hey, I fixed it by ["react-date-picker" :default DatePicker]. I'll read up on the userguide you send me about shadowcljs and npm packages. Thanks for helping m8 🙂

👍 3