Code Monkey home page Code Monkey logo

Comments (6)

a-h avatar a-h commented on July 23, 2024 1

I'm sorry, I haven't been able to reproduce this issue.

To reproduce, I used the following project.

package main

import (
	"fmt"
	"net/http"

	"github.com/a-h/templ"
)

func main() {
	mux := http.NewServeMux()
	mux.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
		templ.Handler(page()).ServeHTTP(w, r)
	})
	err := http.ListenAndServe("localhost:8080", mux)
	if err != nil {
		fmt.Println(err)
	}
}
package main

templ page() {
	<!DOCTYPE html>
	<html lang="en">
		<head>
			<meta charset="UTF-8"/>
			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
			<title>Document</title>
		</head>
		<body>
			for _, name := range []string{"name1", "name2"} {
				{ name }
			}
			// bug-trigger
			<p>THIS WILL BE RENDRED IF I UNCOMMENT THE LINE ABOVE</p>
		</body>
	</html>
}
templ generate --watch --proxy=http://localhost:8080 --cmd="go run ."

Here's a screen capture of what I see.

templ.reload.mp4

Reading back through the comments more closely, I see that this is actually related to having air and templ both trying to do hot reload at the same time. It seems you've got a solution, and documented it for others at #596

I'll close this.

from templ.

leandergangso avatar leandergangso commented on July 23, 2024

Can perhaps be related to that templ generate will remove all _templ.txt files.
But when you stop the templ generate -watch ... the _templ.txt files remains.
Fixing just this will not solve all the cases for this problem tho.

from templ.

leandergangso avatar leandergangso commented on July 23, 2024

Note: if there is a way to use templ generate -watch -proxy to get hot-reload and also re-build go also when non related templ files are edited, that would be nice. :)

Since to problem above stems from me trying to get this by combining air and templ watch proxy.

from templ.

leandergangso avatar leandergangso commented on July 23, 2024

With some more testing, with the same approach of running go run . and templ generate -watch -proxy="...".
The main issue seems to be that the go-server needs to restart preferably before the reload event is sent, but this seem to be hard to do without using the -cmd flag.
By using the -cmd flag I can't run air in a separate terminal, since that will lead to two go-servers running. :P

So I guess the workaround in the meantime is to just use -cmd=air and let templ restart air.

from templ.

leandergangso avatar leandergangso commented on July 23, 2024

See #596 discussion for the semi-solution I ended up using.

@a-h it seems to me that there are some cases where there is a conflict between when the templ don't thinks it need to
re-generate GO code, but it has done it anyways, so _templ.go and _templ.txt don't match up? As in the case with this bug i think. (see steps to recreate in first comment)

Note: hope you're not bothered by me "spamming" a bit. :P

from templ.

leandergangso avatar leandergangso commented on July 23, 2024

Think I perhaps found the cause of this issue, since in this case I didn't rebuild GO so any changes to _templ.go is not taken into effect for the current go-server.

If I edit a .templ file by adding a new line with some text or html, both the _templ.go and _templ.txt is updated, but any additional changes to that same line will only update _templ.txt.

It seems that \n (new line) causes the _templ.go to be rebuilt even tho I don't see a reason for why that has to be the case. If possible to build in a way that don't require this, we could have much more cases with faster
hot-reload since we can omit the rebuild of _templ.go and go-server.

I haven't looked to much into the source code, so just throwing some thoughts around this. :P

from templ.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.