Hello,
I have a problem with one of the CLJS split module I lazy load. This CLJS
split depends on a manually written Closure library in Javascript, itself
depending on another manually written Closure lib. When the split loads and
is executed, it successfully loads its Closure dependency but this Closure
lib fails to load its own Closure dep. I can verify it in the browser
console, the transitive deep Closure lib namespace doesn't exist.
The goal is to lazy load external trackers (à la Google Analytics) only
when necessary, so I wrap the small JS code they require in a CLJS
namespace that I can lazy-load with cljs.loader. As a note, another reason
we wrap Closure tracker libs in CLJS ns is we also use them in non CLJS
projects so we can't directly `goog.require` cljs.loader in them.
Details:
Env:
Clojure 1.9.0
Clojurescript 1.9.946
Linux
openjdk version "1.8.0_162"
Boot 2.7.1 and boot-cljs 2.1.4
CLJS compiler options:
Boot-cljs main.cljs.edn
{:require [yoda.core]
:init-fns [yoda.core/init]
:compiler-options {:libs ["trackers/dataLayer.js"
"trackers/google_analytics.js" ;; depends
on trackers/dataLayer.js
"trackers/other_tracker.js"]
:output-dir "js"
:modules {:cljs-base {:output-to "js/main.js"}
:google-analytics {:entries
#{yoda.tracking.google-analytics-wrapper} ;; depends on
trackers/google_analytics.js
:output-to
"js/main.out/google_analytics_wrapper.js"}
:other-tracker {:entries
#{yoda.tracking.other-tracker-wrapper} ;; depends on
trackers/other_tracker.js
:output-to
"js/main.out/other_tracker_wrapper.js"}}}}
Other CLJS compiler options in build.boot:
(task-options! cljs {:compiler-options {:asset-path "/yd/js"
:optimizations :none
:source-map true
:parallel-build true
:verbose true}})
Code-loading in my-project.tracking namespace:
;; start external trackers
(loader/load :google-analytics
(fn []
((resolve
'my-project.tracking.google-analytics-wrapper/start) ga-tracking-id)))
(loader/load :other-tracker
(fn []
((resolve
'my-project.tracking.other-tracker-wrapper/start))))
The generated cljs_deps.js looks ok:
goog.addDependency("../trackers/dataLayer.js", ['trackers.dataLayer'],
['goog.array']);
goog.addDependency("../trackers/google_analytics.js",
['trackers.google_analytics'], ['trackers.dataLayer', 'goog.net.Cookies']);
goog.addDependency("../my_project/tracking/google_analytics_wrapper.js",
['my_project.tracking.google_analytics_wrapper'], ['cljs.loader',
'trackers.google_analytics', 'cljs.core']);
goog.addDependency("../trackers/other_tracker.js",
['trackers.other_tracker'], []);
goog.addDependency("../yoda/tracking/other_tracker_wrapper.js",
['yoda.tracking.other_tracker_wrapper'], ['trackers.other_tracker',
'cljs.loader', 'cljs.core']);
Problems:
1. The browser requests source-maps for all the Closure libs in trackers/
which is weird because the compilation doesn't change them. They're kept as
is. No need to use source-maps for plain JS code right ?
2. The browser requests source-maps at the wrong URI for split modules: it
tries to load them from the root path / directly. Here's the error in the
browser
Source map error: TypeError: NetworkError when attempting to fetch resource.
Resource URL: null
Source Map URL: google_analytics_wrapper.js.map ;; it should be
/yd/js/my_project/tracking/google_analytics_wrapper.js.map where it does
exist (verified on disk)
3. Printing the `trackers` global JS variable in the browser (for the
"trackers" part of the trackers.XXX namespaces) shows that it doesn't
contains the dataLayer namespace, the transitive Closure lib.
4. Code splitting works fine for the `other_tracker` split, I can verify
its code is executed. Hence problem #3 seems to come from the transitive
dependency.
I hope I was clear in explaining the problem. Happy to help you help me by
answering any question.
--
Note that posts from new members are moderated - please be patient with your
first post.
---
You received this message because you are subscribed to the Google Groups
"ClojureScript" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/clojurescript.
