How to use use React libraries in ClojureScript - clojurescript

Question

I'm trying to use cljsjs/vis in my re-frame / reagent / leiningen project, but getting the error when import this library into namespace.
cljsjs/vis in namespace required but not available
Have tried to use another libraries for charts/data visualizations, but still have same result. It seems something wrong with import JS libraries to clojurescript project.
leiningen project.cljs file
(defproject test1 "0.1.0-SNAPSHOT"
:dependencies [[org.clojure/clojure "1.10.1"]
[org.clojure/clojurescript "1.10.764"
:exclusions [com.google.javascript/closure-compiler-unshaded
org.clojure/google-closure-library
org.clojure/google-closure-library-third-party]]
[thheller/shadow-cljs "2.9.3"]
[reagent "0.10.0"]
[re-frame "0.12.0"]
[cljs-ajax "0.7.5"]
[cljsjs/vis "4.21.0-1"]]
:plugins [[lein-shadow "0.2.0"]
[lein-shell "0.5.0"]]
:min-lein-version "2.9.0"
:source-paths ["src/clj" "src/cljs"]
:clean-targets ^{:protect false} ["resources/public/js/compiled" "target"]
:shell {:commands {"open" {:windows ["cmd" "/c" "start"]
:macosx "open"
:linux "xdg-open"}}}
:shadow-cljs {:nrepl {:port 8777}
:builds {:app {:target :browser
:output-dir "resources/public/js/compiled"
:asset-path "/js/compiled"
:modules {:app {:init-fn test1.core/init
:preloads [devtools.preload]}}
:devtools {:http-root "resources/public"
:http-port 8280
}}}}
:aliases {"dev" ["with-profile" "dev" "do"
["shadow" "watch" "app"]]
"prod" ["with-profile" "prod" "do"
["shadow" "release" "app"]]
"build-report" ["with-profile" "prod" "do"
["shadow" "run" "shadow.cljs.build-report" "app" "target/build-report.html"]
["shell" "open" "target/build-report.html"]]
"karma" ["with-profile" "prod" "do"
["shadow" "compile" "karma-test"]
["shell" "karma" "start" "--single-run" "--reporters" "junit,dots"]]}
:profiles
{:dev
{:dependencies [[binaryage/devtools "1.0.0"]]
:source-paths ["dev"]}
:prod {}
}
:prep-tasks [])
cljs file
(ns my-project
(:require [cljsjs.vis]))

Answer 1

shadow-cljs does not support CLJSJS packages. Instead you install the original npm packages those CLJSJS packages represent and use that directly.
So instead of
(ns my-project
(:require [cljsjs.vis]))
;; accessing vis via js/WhateverGlobalItUses
you do
(ns my-project
(:require ["vis-network" :as vis]))
;; then use "vis" directly
The npm version is split into multiple separate packages, so just include whatever you want to use.
The shadow-cljs docs explain using npm packages is much more detail. There is also an older example repo using vis-network.