npm install

?

tried but still this annoying error message

The required namespace "ajax.core" is not available, it was required by "toy_project1/events.cljs".

What does the problematic :require look like?

like this :

[ajax.core :as ajax]))

If that's the code that you wrote yourself - why did you put that vector there in the first place, where did you get it?

no, it from another project

Does that project depend on cljs-ajax?

not that I know this is the package.json

{
  "name": "reagent-projects",
  "version": "0.0.1",
  "private": true,
  "devDependencies": {
    "shadow-cljs": "2.16.6"
  },
  "dependencies": {
    "ajax": "0.0.4",
    "highlight.js": "10.7.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2"
  }
}

Also, you say that it's another project but note that the error mentions toy_project1/events.cljs. You haven't given us much context, but just the error alone suggests that you want to use cljs-ajax but you forgot to put it in your project's dependency list.

The error has nothing to do with NPM or package.json. cljs-ajax is a CLJS dependency, not an NPM one.

oke

Also, if you installed that ajax with NPM just to try to fix this error then remove it before you forget. :) And in general, try to avoid installing anything via NPM unless you're 100% you need it. Even if you install and immediately uninstall something, your whole dependency list might be different because of the way NPM dependency resolution works.

oke, how do I then install that cljs-ajax thing

With CLJS, you don't install it, you specify it as a dependency. Same way you have already done it with reagent and re-frame.

oke, then I have to look for a version number to use

still the error

I have added the package to the json file

{
  "name": "reagent-projects",
  "version": "0.0.1",
  "private": true,
  "devDependencies": {
    "shadow-cljs": "2.16.6"
  },
  "dependencies": {
    "ajax": "0.0.4",
    "highlight.js": "10.7.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "cljs-ajax": "0.7.5"
  }
}

and I need the package in this file

(ns toy-project1.events
  (:require
   [re-frame.core :as re-frame]
   [toy-project1.db :as db]
   [toy-project1.config :as config]
   [ajax.core :as ajax]))

(re-frame/reg-event-db
 ::initialize-db
 (fn [_ _]
   db/default-db))

(re-frame/reg-event-db
 ::http-fail
 (fn [db [_ key-path]]
   (assoc-in db key-path {})))

(re-frame/reg-event-db
 ::http-success
 (fn [db [_ key-path result]]
   (assoc-in db key-path result)))

(re-frame/reg-event-fx
 ::fetch-weather
 (fn [_ _]
   {:http-xhrio
    {:method :get
     :uri    ""
     :params {:lat   (:lat config/home)
              :lon   (:lon config/home)
              :units "imperial"
              :appid config/open-weather-api-key}
     :response-format (ajax/json-response-format {:keywords? true})
     :on-success      [::events/http-success [:weather]]
     :on-failure      [::events/http-fail [:weather]]}}))

but still this outcome

npx shadow-cljs watch app
shadow-cljs - config: /home/roelof/reagent-projects/shadow-cljs.edn
shadow-cljs - HTTP server available at 
shadow-cljs - server version: 2.16.6 running at 
shadow-cljs - nREPL server started on port 41661
shadow-cljs - watching build :app
[:app] Configuring build.
[:app] Compiling ...
[:app] Build failure:
The required namespace "ajax.core" is not available, it was required by "toy_project1/events.cljs".

> I have added the package to the json file As I said here: > cljs-ajax is a CLJS dependency, not an NPM one. and here: > Same way you have already done it with reagent and re-frame. it shouldn't be added to package.json. It should be added to deps.edn or project.clj or shadow-cljs.edn - whatever you're using to specify your CLJS dependencies.

NPM dependencies and CLJS dependencies are two completely different worlds that CLJS build tools know how to use together. They don't interoperate in any ways, so NPM dependencies have to be specified via NPM ways, and CLJS dependencies have to be specified via CLJS ways.

Thanks, it almost compiles

Either resolve the circular dependency error by extracting common functionality into a separate namespace or use a full name of the keyword. So if a is an alias for namespace foo.a, then you can use :foo.a/keyword instead of ::a/keyword - without having to require foo.a.

CLJ 1.11 will allow you to alias namespaces for usage with keywords without actually loading those namespaces. And it's likely that it'll soon become available in CLJS as well.

I need a break

----- ERROR -------------------------------------------------------------------
 File: /home/roelof/reagent-projects/src/toy_project1/events.cljs:34:58
--------------------------------------------------------------------------------
  31 |               :units "imperial"
  32 |               :appid config/open-weather-api-key}
  33 |      :response-format (ajax/json-response-format {:keywords? true})
  34 |      :on-success      [::toy-project1.events/http-success [:weather]]
----------------------------------------------------------------^---------------
toy_project1/events.cljs [line 34, col 58] Invalid keyword: ::toy-project1.events/http-success.

Same exact error as before - the alias is not available.

found it I needed one : instead of two ::

An advice - start the compiler's watch when your project is buildable (assuming, you left it that way), wait for it to finish, and then start introducing gradual changes. Don't write hundreds of lines of code and then build it all at once. The more gradual you are, the easier it is to notice such errors in a timely manner and fix them right then and there.

I do that already

thanks for the help

No problem.

learned a few things on the road to learning react

but still a lot to learn

you are in the toy-project1.events namespace so to do it properly you just do ::http-success

:: uses the current namespace as the alias so that becomes :toy-project1.events/http-success. if you are in another file you need a require with :as and use that alias to get the same one

thanks