shadow-cljs-hooks
shadow-cljs-hooks copied to clipboard
Published
20 hours ago •
beetleman
beetleman
useful hooks for shadow-cljs
shadow-cljs-hooks
This library provides collections of useful hooks for shadow-cljs:
shadow-cljs-hooks.index- generatingindex.htmlshadow-cljs-hooks.fulcro-css- generating CSS file for Fulcro3
Getting Started
Add the following dependency to your deps.edn file:
org.clojars.beetleman/shadow-cljs-hooks {:mvn/version "current version from clojars"}
Add some build hook to shadow-cljs.edn, eg. shadow-cljs-hooks.index/hook:
{...
:builds
{:app {:target ...
:build-hooks
[(shadow-cljs-hooks.index/hook)]
...}}}}
checkout fulcro3 example or re-frame example to seeing it in action.
Hooks
shadow-cljs-hooks.index
Generate index.html based on provided options, works with :module-hash-names true.
options
:path- (optional, default: generated from:output-dirand:asset-path) whereindex.htmlshould be located:lang- (optional, default:"en"')<html lang=...>:title- (optional, default:"ClojureScript 🥳🏆")<title>...</title>:scripts- (optional, default:[]) list of included.jsfiles:entry-point- (optional, default:nil) entry point for application, eg.:app/init. Optional because:init-fnin modules configuration can handle it:links- (optional, default:[]) list of included.cssfiles
example
[(shadow-cljs-hooks.index/hook {:links ["https://cdn.jsdelivr.net/npm/[email protected]/dist/semantic.min.css"]
:scripts ["https://cdn.jsdelivr.net/npm/[email protected]/dist/semantic.min.js"]})]
Used in More in re-frame example and fulcro3 example
shadow-cljs-hooks.fulcro-css
Generate CSS files from fulcro3 project. Works with index hook.
requirements
options
:output-dir(required) the directory to use for garden output:asset-path(required) the relative path from web server’s root to the resources in:output-dir:component(required)Rootcomponent from whichCSSwill be generated:garden-flags(optional, default{:pretty-print? false}) garden flags
example
[(shadow-cljs-hooks.fulcro-css/hook {:component app.main/Root
:output-dir "public/css"
:asset-path "/css"})
(shadow-cljs-hooks.index/hook)]
More in fulcro3 example
shadow-cljs-hooks.garden
Generate CSS files from garden compatible vector. Works with index hook as well.
requirements
options
:output-dir(required) the directory to use for garden output:asset-path(required) the relative path from web server’s root to the resources in:output-dir:css(required) symbol with definition of styles:garden-flags(optional, default{:pretty-print? false}) garden flags
example
[(shadow-cljs-hooks.garden/hook {:css app.css/css
:output-dir "public/css"
:asset-path "/css"})
(shadow-cljs-hooks.index/hook)]
More in re-frame example
TODO
- [x] pure garden hook
- [x] reagent/reframe example
- [ ] code cleanup
beetleman