A Hyperappdispatch initializer that logs state updates and action information to the console.
This example shows a counter that can be incremented or decremented. Go ahead and try it online with your browser console open to see the log messages.
import{app}from"hyperapp";importloggerfrom"hyperapp-logger";constUp=state=>state+1;constDown=state=>state-1;app({init: 0,view: state=>(<main><h1>{state.count}</h1><buttononclick={Down}>ー</button><buttononclick={Up}>+</button></main>),node: document.getElementById("app"),dispatch: logger});Install with npm / Yarn.
npm i hyperapp-logger
Then with a module bundler like rollup or webpack use as you would anything else.
importloggerfrom"hyperapp-logger";Download the minified library from the CDN.
<scriptsrc="https://unpkg.com/hyperapp-logger"></script>You can find the library in window.hyperappLogger.
importloggerfrom"hyperapp-logger";app({
init,
view,
node,dispatch: logger});// Or if you need to pass optionsapp({
init,
view,
node,dispatch: logger(options)});Use it to customize the log function.
app({
init,
view,
node,dispatch: logger({log(state,action,props,actionResult){// format and send your log messages anywhere you like}})});Hyperapp Logger is MIT licensed. See LICENSE.
