From 31e97698eb97643d4681f9fba6a81b8176c726c7 Mon Sep 17 00:00:00 2001 From: Gabriel Horner Date: Tue, 23 Jan 2024 15:17:05 -0500 Subject: [PATCH 1/3] fix: publishing not loading correctly Caused by pulling in the new component system. Fixes #10893 --- deps/publishing/src/logseq/publishing/html.cljs | 3 +++ shadow-cljs.edn | 8 +++++++- 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/deps/publishing/src/logseq/publishing/html.cljs b/deps/publishing/src/logseq/publishing/html.cljs index 16568d9c8de..438f9f8102f 100644 --- a/deps/publishing/src/logseq/publishing/html.cljs +++ b/deps/publishing/src/logseq/publishing/html.cljs @@ -121,6 +121,9 @@ necessary db filtering" } }(window.location))"] ;; TODO: should make this configurable + [:script {:src "static/js/react.production.min.js"}] + [:script {:src "static/js/react-dom.production.min.js"}] + [:script {:src "static/js/ui.js"}] [:script {:src "static/js/main.js"}] [:script {:src "static/js/interact.min.js"}] [:script {:src "static/js/highlight.min.js"}] diff --git a/shadow-cljs.edn b/shadow-cljs.edn index d9345081d6b..fe5eb26b151 100644 --- a/shadow-cljs.edn +++ b/shadow-cljs.edn @@ -90,7 +90,13 @@ :publishing {:target :browser :module-loader true - :js-options {:ignore-asset-requires true} + :js-options {;; handle `require(xxx.css)` + :ignore-asset-requires true + :resolve {"react" {:target :global + :global "React"} + "react-dom" {:target :global + :global "ReactDOM"}}} + :modules {:main {:init-fn frontend.publishing/init} :code-editor From 64f45deaff7a81d2d592a6e0944e3059beee588e Mon Sep 17 00:00:00 2001 From: Gabriel Horner Date: Mon, 22 Jan 2024 14:35:36 -0500 Subject: [PATCH 2/3] enhance: add a --dev mode to publishing that pairs with shadow's watch --- deps/publishing/src/logseq/publishing.cljs | 5 ++-- .../src/logseq/publishing/export.cljs | 27 ++++++++++++------- docs/dev-practices.md | 8 ++++-- scripts/src/logseq/tasks/dev/publishing.cljs | 4 +-- 4 files changed, 29 insertions(+), 15 deletions(-) diff --git a/deps/publishing/src/logseq/publishing.cljs b/deps/publishing/src/logseq/publishing.cljs index e78c8676311..5cd9d86a4d2 100644 --- a/deps/publishing/src/logseq/publishing.cljs +++ b/deps/publishing/src/logseq/publishing.cljs @@ -18,7 +18,7 @@ can be passed: can be icon, name, alias, title, description and url * :default-notification-fn - Configure how errors are reported when creating the export. Default is to throw an exception when it occurs." - [db static-dir graph-dir output-dir {:keys [notification-fn] + [db static-dir graph-dir output-dir {:keys [notification-fn dev?] :or {notification-fn default-notification-fn} :as options}] (let [options' (cond-> options @@ -28,4 +28,5 @@ can be passed: (assoc-in [:app-state :ui/radix-color] (:ui/radix-color options))) {:keys [html asset-filenames]} (publish-html/build-html db options')] (publish-export/create-export html static-dir graph-dir output-dir {:asset-filenames asset-filenames - :notification-fn notification-fn}))) + :notification-fn notification-fn + :dev? dev?}))) diff --git a/deps/publishing/src/logseq/publishing/export.cljs b/deps/publishing/src/logseq/publishing/export.cljs index 2e857e58183..0ae51f3da7d 100644 --- a/deps/publishing/src/logseq/publishing/export.cljs +++ b/deps/publishing/src/logseq/publishing/export.cljs @@ -22,21 +22,30 @@ (defn- cleanup-js-dir "Moves used js files to the correct dir and removes unused js files" - [output-static-dir] + [output-static-dir source-static-dir {:keys [dev?]}] (let [publishing-dir (node-path/join output-static-dir "js" "publishing")] (p/let [_ (p/all (map (fn [file] (fs/rmSync (node-path/join output-static-dir "js" file) #js {:force true})) js-files)) + _ (when dev? + (fse/remove (node-path/join output-static-dir "js" "cljs-runtime"))) _ (p/all (map (fn [file] - (fs/renameSync - (node-path/join publishing-dir file) - (node-path/join output-static-dir "js" file))) + (if dev? + (fs/symlinkSync + (node-path/join source-static-dir "js" "publishing" file) + (node-path/join output-static-dir "js" file)) + (fs/renameSync + (node-path/join publishing-dir file) + (node-path/join output-static-dir "js" file)))) js-files)) + _ (when dev? + (fs/symlinkSync (node-path/join source-static-dir "js" "publishing" "cljs-runtime") + (node-path/join output-static-dir "js" "cljs-runtime"))) ;; remove publishing-dir - _ (p/all (map (fn [file] - (fs/rmSync (node-path/join publishing-dir file))) - (fs/readdirSync publishing-dir))) - _ (fs/rmdirSync publishing-dir) + _ (when-not dev? (p/all (map (fn [file] + (fs/rmSync (node-path/join publishing-dir file))) + (fs/readdirSync publishing-dir)))) + _ (when-not dev? (fs/rmdirSync publishing-dir)) ;; remove source map files _ (p/all (map (fn [file] (fs/rmSync (node-path/join output-static-dir "js" (str file ".map")) #js {:force true})) @@ -90,7 +99,7 @@ _ (fs/writeFileSync (node-path/join output-static-dir "css" "custom.css") custom-css) custom-js (if (fs/existsSync custom-js-path) (str (fs/readFileSync custom-js-path)) "") _ (fs/writeFileSync (node-path/join output-static-dir "js" "custom.js") custom-js) - _ (cleanup-js-dir output-static-dir)] + _ (cleanup-js-dir output-static-dir static-dir options)] (notification-fn {:type "success" :payload (str "Export public pages and publish assets to " output-dir " successfully 🎉")})) (p/catch (fn [error] diff --git a/docs/dev-practices.md b/docs/dev-practices.md index ea6a1f1ae47..df296579186 100644 --- a/docs/dev-practices.md +++ b/docs/dev-practices.md @@ -307,10 +307,14 @@ point out: ```sh # One time setup $ cd scripts && yarn install && cd - - # Build the export + # Build a release export $ bb dev:publishing /path/to/graph-dir tmp/publish + # OR build a dev export with `clojure -M:cljs watch publishing` and then + $ bb dev:publishing /path/to/graph-dir tmp/publish --dev + # View the app in a browser - $ open tmp/publish/index.html + $ python3 -m http.server 8080 -d tmp/db-publish &; open http://localhost:8080 + ``` There are also some tasks under `nbb:` which are useful for inspecting database diff --git a/scripts/src/logseq/tasks/dev/publishing.cljs b/scripts/src/logseq/tasks/dev/publishing.cljs index 2524158bd3b..89b3de40f1b 100644 --- a/scripts/src/logseq/tasks/dev/publishing.cljs +++ b/scripts/src/logseq/tasks/dev/publishing.cljs @@ -12,7 +12,7 @@ (defn -main [& args] - (when-not (= 3 (count args)) + (when (< (count args) 3) (println "Usage: $0 STATIC-DIR GRAPH-DIR OUT-DIR") (js/process.exit 1)) (let [[static-dir graph-dir output-path] @@ -23,4 +23,4 @@ static-dir graph-dir output-path - {:repo-config repo-config :ui/theme "dark" :ui/radix-color :purple}))) + {:repo-config repo-config :ui/theme "dark" :ui/radix-color :purple :dev? (contains? (set args) "--dev")}))) From bd4e4bc041b7932e04ee243e469250a0fe8d60df Mon Sep 17 00:00:00 2001 From: Gabriel Horner Date: Tue, 23 Jan 2024 21:44:26 -0500 Subject: [PATCH 3/3] enhance: publishing --dev also watches frontend also provide a dedicated backend command for simpler rebuilding of backend --- bb.edn | 31 ++++++++++++++----- .../src/logseq/publishing/export.cljs | 5 +-- docs/dev-practices.md | 15 ++++++--- scripts/src/logseq/tasks/dev.clj | 29 +++++++++++++++-- 4 files changed, 63 insertions(+), 17 deletions(-) diff --git a/bb.edn b/bb.edn index 1e447d92f81..76e1ba171a2 100644 --- a/bb.edn +++ b/bb.edn @@ -31,15 +31,32 @@ dev:app-watch logseq.tasks.dev.mobile/app-watch - dev:build-publishing - logseq.tasks.dev/build-publishing + -dev:build-publishing-frontend + logseq.tasks.dev/build-publishing-frontend + + dev:publishing-backend + logseq.tasks.dev/publishing-backend + + -dev:publishing-release + {:depends [-dev:build-publishing-frontend] + :doc "Build release publishing spa app given graph and output dirs" + :task (run 'dev:publishing-backend)} + + -dev:watch-publishing-frontend + logseq.tasks.dev/watch-publishing-frontend + + -dev:watch-publishing-backend + logseq.tasks.dev/watch-publishing-backend + + -dev:publishing-dev + {:depends [-dev:watch-publishing-frontend -dev:watch-publishing-backend] + :doc "Watch dev publishing spa app given graph and output dirs"} dev:publishing - {:depends [dev:build-publishing] - :doc "Build publishing spa app given graph and output dirs" - :task (apply shell {:dir "scripts"} - "yarn -s nbb-logseq -cp src -m logseq.tasks.dev.publishing" - (into ["static"] *command-line-args*))} + {:doc "Builds full publishing app given graph and output dirs. Append --dev to watch frontend" + :task (if ((set *command-line-args*) "--dev") + (run '-dev:publishing-dev {:parallel true}) + (run '-dev:publishing-release))} dev:npx-cap-run-ios logseq.tasks.dev.mobile/npx-cap-run-ios diff --git a/deps/publishing/src/logseq/publishing/export.cljs b/deps/publishing/src/logseq/publishing/export.cljs index 0ae51f3da7d..4e986e78a31 100644 --- a/deps/publishing/src/logseq/publishing/export.cljs +++ b/deps/publishing/src/logseq/publishing/export.cljs @@ -42,10 +42,7 @@ (fs/symlinkSync (node-path/join source-static-dir "js" "publishing" "cljs-runtime") (node-path/join output-static-dir "js" "cljs-runtime"))) ;; remove publishing-dir - _ (when-not dev? (p/all (map (fn [file] - (fs/rmSync (node-path/join publishing-dir file))) - (fs/readdirSync publishing-dir)))) - _ (when-not dev? (fs/rmdirSync publishing-dir)) + _ (when-not dev? (fse/remove publishing-dir)) ;; remove source map files _ (p/all (map (fn [file] (fs/rmSync (node-path/join output-static-dir "js" (str file ".map")) #js {:force true})) diff --git a/docs/dev-practices.md b/docs/dev-practices.md index df296579186..356f937311f 100644 --- a/docs/dev-practices.md +++ b/docs/dev-practices.md @@ -307,13 +307,20 @@ point out: ```sh # One time setup $ cd scripts && yarn install && cd - - # Build a release export + + # Build a release publishing app $ bb dev:publishing /path/to/graph-dir tmp/publish - # OR build a dev export with `clojure -M:cljs watch publishing` and then + + # OR build a dev publishing app that watches frontend changes $ bb dev:publishing /path/to/graph-dir tmp/publish --dev - # View the app in a browser - $ python3 -m http.server 8080 -d tmp/db-publish &; open http://localhost:8080 + # View the publishing app in a browser + $ python3 -m http.server 8080 -d tmp/publish &; open http://localhost:8080 + + # Rebuild the publishing backend for dev/release. + # Handy when making backend changes in deps/publishing or + # to test a different graph + $ bb dev:publishing-backend /path/graph-dir tmp/publish ``` diff --git a/scripts/src/logseq/tasks/dev.clj b/scripts/src/logseq/tasks/dev.clj index e3b9915d5bf..d49fb48ac77 100644 --- a/scripts/src/logseq/tasks/dev.clj +++ b/scripts/src/logseq/tasks/dev.clj @@ -3,6 +3,7 @@ namespaces" (:require [babashka.process :refer [shell]] [babashka.fs :as fs] + [logseq.tasks.util :as task-util] [clojure.java.io :as io] [clojure.pprint :as pp] [clojure.edn :as edn])) @@ -37,8 +38,8 @@ (pp/pprint (edn/read-string (:out (shell {:out :string} "node ./static/gen-malli-kondo-config.js")))))] (spit config-edn config)))) -(defn build-publishing - "Builds release publishing asset when files have changed" +(defn build-publishing-frontend + "Builds frontend release publishing asset when files have changed" [& _args] (if-let [_files (and (not (System/getenv "SKIP_ASSET")) (seq (set (fs/modified-since (fs/file "static/js/publishing/main.js") @@ -47,3 +48,27 @@ (println "Building publishing js asset...") (shell "clojure -M:cljs release publishing")) (println "Publishing js asset is up to date"))) + +(defn publishing-backend + "Builds publishing backend and copies over supporting frontend assets" + [& args] + (apply shell {:dir "scripts"} + "yarn -s nbb-logseq -cp src -m logseq.tasks.dev.publishing" + (into ["static"] args))) + +(defn watch-publishing-frontend + [& _args] + (shell "clojure -M:cljs watch publishing")) + +(defn watch-publishing-backend + "Builds publishing backend once watch-publishing-frontend has built initial frontend" + [& args] + (let [start-time (java.time.Instant/now)] + (Thread/sleep 3000) + (loop [n 1000] + (if (and (fs/exists? "static/js/publishing/main.js") + (task-util/file-modified-later-than? "static/js/publishing/main.js" start-time)) + (apply publishing-backend args) + (do (println "Waiting for publishing frontend to build...") + (Thread/sleep 1000) + (recur (inc n))))))) \ No newline at end of file