index.html

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <script type="text/javascript" src="/elm.js"></script>
    <script type="text/javascript" src="/assets/dagre.min.js"></script>
  <head>
  <body>
    <div id="elm"></div>
    <script type="text/javascript">
      //var dagre = require("dagre");

      var app = Elm.Main.init({
        node: document.getElementById("elm")
      });

      app.ports.layout.subscribe((data) => {
        //console.log(data);

        var g = dagre.graphlib.json.read(JSON.parse(data));

        dagre.layout(g);

        //console.dir(g.graph());

        var graph = dagre.graphlib.json.write(g);

        //console.dir(graph);

        app.ports.graphs.send(graph);
      });
    </script>
  </body>
</html>