Elm-watch 1.1.0 released!

lydell · October 29, 2022, 2:17pm

I just released elm-watch 1.1.0, with a bunch of edge case fixes and a couple of new features!

The biggest feature is the opt-in error overlay in the browser, with clickable error locations!
You can now move the browser UI to a different corner.

I go through those two features in more detail in this video:

Full changelog:

Note: If you use elm-watch together with run-pty, make sure to update run-pty to 4.0.2 or later!

jfmengels · October 29, 2022, 2:45pm

These are all really cool and useful features! Amazing job!

Loved the intro to the video as well

dirkbj · November 1, 2022, 4:47pm

Well done! These are great additions. Excited to see the next update.

Bjorn_van_den_Broek · November 1, 2022, 5:58pm

Great video about a great tool. There is only one thing holding me back from moving from elm-live to elm-watch and that is the proxy functionality to reach the back-end. I know you do not want to extend elm-watch with all kind of none-core functionalities. But do you know a good tool to setup a proxy to the back-end that could work alongside elm-watch?

lydell · November 2, 2022, 5:35am

Personally, I don’t use a tool for proxying – I write a little bit of Node.js code to have full control. You can see that in the example dev server.

Specifically, here is a function for proxying a backend (you could simplify it to always go to 127.0.0.1 but to a certain port):

github.com

lydell/elm-watch/blob/b645c566ad430138128a67e047f2e91da1f30c81/example/dev-server.js#L196-L218


      
          function proxyToWeb(req, res, log, hostname) {
            const options = {
              hostname,
              path: req.url,
              method: req.method,
              headers: { ...req.headers, host: hostname },
            };
          
          
  const proxyReq = https.request(options, (proxyRes) => {
              const { statusCode } = proxyRes;
              log(`-> ${hostname}`, statusCode);
              res.writeHead(statusCode, proxyRes.headers);
              proxyRes.pipe(res, { end: true });
            });
          
          
  proxyReq.on("error", (error) => {
              log(503);
              res.writeHead(503);
              res.end(`Failed to proxy to ${hostname}. Is it down?\n\n${error.stack}`);
            });

This file has been truncated. show original

I recently copied that example and reduced it to just one app when I needed it for a project:

github.com

lydell/elm-app-url/blob/2087c299f95dee5c66b397fb35c90196a6b7892b/dev-server.js#L95


      
          
          
function formatTime(date) {
            return [date.getHours(), date.getMinutes(), date.getSeconds()]
              .map((number) => number.toString().padStart(2, "0"))
              .join(":");
          }
          
          
const server = http.createServer((req, res) => {
            const log = makeLog(req);
            if (req.url.startsWith("/api/")) {
              proxyToWeb(req, res, log, "ci.concourse-ci.org");
            } else {
              serveFile(
                req,
                res,
                log,
                looksLikeFile(req.url) ? req.url : "/public/index.html"
              );
            }
          });

Bjorn_van_den_Broek · November 2, 2022, 8:00pm

Thanks for your extensive reply. I highly appreciate it. I will move to elm-watch

rupert · November 3, 2022, 9:52am

Just wanted to say elm-watch is really exellent, thanks for making it.

We already have a build that runs in a loop using webpack to make the dev/prod builds. However, even with that running I will typically run elm-watch alongside, like this npx elm-watch hot. As I code the Elm side, I tend to look at the output of that over our proper build, since it is very fast and easier to read.

system · November 13, 2022, 9:53am

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.

Topic		Replies	Views
Introducing elm-watch: elm make in watch mode. Fast and reliable Show and Tell	11	3302	September 23, 2022
Elm-watch in action Show and Tell	7	807	January 12, 2023
Elm-watch not injecting itself Learn	4	485	May 11, 2023
New `elm-live` 4.0.0 Alpha! Request Feedback	5	1391	August 9, 2019
Are those downsides still valid today? Learn	12	2803	February 23, 2021

Elm-watch 1.1.0 released!

Related topics