Untitled

hyperapp1/index.html

<!doctype html>
<html class="no-js" lang="">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title>Postix</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
    </head>
    <body>
        <script src="src/index.js"></script>
    </body>
</html>

----------------------------------------------.

hyperapp1/.babelrc

{
  "presets": ["env"],

  "plugins": [["transform-react-jsx", { "pragma": "h" }]]
}

---------------------
hyperapp1/src/index.js

import { Route, location } from "@hyperapp/router";

import Layout from "./components/Layout.js";
import Home from "./pages/Home.js";
import About from "./pages/About.js";

const state = {
    location: location.state
};

const actions = {
    location: location.actions
};

const view = () => h("div", {class:"main"}, [
    h(Route, { path: "/", render: () => Layout({}, Home) }),
    h(Route, { path: "/about", render: () => Layout({}, About) })
])

const main = logger()(app)(state, actions, view, document.body)
const unsubscribe = location.subscribe(main.location);