Comments (6)
I played around a bit more with this and added the following to my LazyVim configuration and now it's only templ that is used for formatting:
return {
"stevearc/conform.nvim",
opts = {
formatters_by_ft = {
templ = { "templ" },
},
},
}
And I guess that's the end result that we want right? That it's only templ that performs fmt and not the chain of activated LSP's that can handle formatting.
from templ.
Continued to experiment a bit this component will also break the lines incorrect
templ PriceInput(name, label, placeholder, value, err string) {
<div class="sm:col-span-2">
<label for={ name } class="block text-sm font-medium leading-6 text-white">{ label }</label>
<div class="relative mt-2">
<input
type="text"
name={ name }
value={ value }
placeholder={ placeholder }
id={ name }
class={ templ.KV("text-red-500 ring-red-700", hasErr(err)), templ.KV("text-white ring-white/10",!hasErr(err)), "block w-full rounded-md border-0 bg-white/5 py-1.5 shadow-sm ring-1 ring-inset focus:ring-2 focus:ring-inset focus:ring-green-700 sm:text-sm sm:leading-6" }
/>
<div class="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3">
<span class="text-gray-500 sm:text-sm" id="price-currency">DKK</span>
</div>
if hasErr(err) {
<p class="mt-2 text-xs text-red-600">{ err }</p>
}
</div>
</div>
}
after templ fmt it will look like this:
templ PriceInput(name, label, placeholder, value, err string) {
<div class="sm:col-span-2">
<label for={ name } class="block text-sm font-medium leading-6 text-white">{ label }</label>
<div class="relative mt-2">
<input
type="text"
name={ name }
value={ value }
placeholder={ placeholder }
id={ name }
class={ templ.KV("text-red-500 ring-red-700", hasErr(err)), templ.KV("text-white
ring-white/10",!hasErr(err)), "block w-full rounded-md border-0 bg-white/5 py-1.5 shadow-sm ring-1 ring-inset focus:ring-2 focus:ring-inset focus:ring-green-700 sm:text-sm sm:leading-6" }
/>
<div class="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3">
<span class="text-gray-500 sm:text-sm" id="price-currency">DKK</span>
</div>
if hasErr(err) {
<p class="mt-2 text-xs text-red-600">{ err }</p>
}
</div>
</div>
}
Err: String literal is not terminated
It only seems to happen from neovim, when I use templ fmt ../
from commandline it seems to be working correctly
from templ.
Digging a bit further by enabling and disabling LSP's running on templ files it seems like it's when html-lsp is trying to format the HTML then the formatting of the templ files will result string literal missing termination.
installed version of html-lsp is v4.8.0
I wonder what can be done about this? 🤔
from templ.
Nice, that seems right to me. Something like the html lsp wouldn't understand how to format a templ file properly.
from templ.
Does that resolve this issue for you now then?
from templ.
Yea it has resolved my issue, so I will just close it :)
from templ.
Related Issues (20)
- Proposal: Introduce JsGenericVar for Event and Element Access in element event handlers HOT 5
- `templ generate` takes a long time for unformatted files HOT 6
- refactor: update `templ generate` to support pwd being a symlink HOT 3
- Templ formatting breaks imports at v0.2.747 HOT 7
- Composable templates do not render properly in tests HOT 1
- App freeze using air proxy HOT 1
- templ-vscode "Request textDocument/codeAction failed" HOT 2
- Streaming Not Working
- [Proposal] Improve embedding components HOT 2
- proposal: Go comments within HTML tags HOT 1
- Raw go errors if block ends with a comment
- LSP crashes after being started by kakoune-lsp HOT 4
- How to prevent cache HOT 1
- .templ file with only script elements leads to unused import HOT 1
- Anyway to instantiate a templ once per rendering context? HOT 4
- performance: templ parse takes a long time and uses high CPU when unclosed void elements are used HOT 8
- Little typo in streaming documentation
- bug: `templ generate --watch --proxy` triggers 2 browser reload events HOT 1
- bug: ambiguous child/string expression grammar HOT 4
- bug: go to definition causes error in Neovim v0.10.x HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
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.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from templ.