-
-
Notifications
You must be signed in to change notification settings - Fork 4k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
missing type of HTMLAttribute #11684
Comments
If you're trying to alter a single style programmatically in Svelte 4, I'd recommend style directives. <script lang="ts">
let scale = 1.0
function scale_up(){
scale = 1.5
}
function reset_scale(){
scale = 1.0
}
</script>
<img
style="width: 2em; height: 2em; background-color: red; display: inline-block; transition: scale 0.5s;"
style:scale
on:mouseover={scale_up}
on:mouseout={reset_scale}
alt="Parametrix logo"
/> This also ties into the error you're seeing. In Svelte 4, the |
Thank you James for your quick response! |
This might not be a great fit between what you're using (a lot of imperative DOM manipulation) and Svelte (a declarative framework by design). I'm pretty sure you can do everything in that library with Svelte, and write it more expressively, with less code to type. Have you already gone through the Svelte tutorial? A lot of the stuff can be achieved with bindings, actions, and declarative markup. |
Using the event attribute and passing a string is highly discouraged. In Svelte 5, event attributes will error when being passed a string. As pointed out by others I suggest to solve this differently through the mechanics Svelte offers. Therefore closing as "wontfix" |
Describe the bug
The following code works but svelte-check generates an error:
1- The error message
Error: Object literal may only specify known properties, and '"onmouseover"' does not exist in type 'HTMLProps<"img", HTMLAttributes>'. (ts)
style="width: 9em; display: inline-block; transition: transform 0.5s;"
onmouseover="this.style.transform = 'scale(1.25)'"
onmouseout="this.style.transform = 'scale(1.0)'"
2- The svelte code:
Attributes of the HTML tag img:
src="{base}/favicon.svg"
style="width: 9em; display: inline-block; transition: transform 0.5s;"
onmouseover="this.style.transform = 'scale(1.25)'"
onmouseout="this.style.transform = 'scale(1.0)'"
alt="Parametrix logo"
Reproduction
https://svelte.dev/repl/da7835978d2f4fad99f4172d529391bd?version=4.2.17
In this repl, I have replace the tag img with div for simplifying the code
Logs
System Info
Severity
annoyance
The text was updated successfully, but these errors were encountered: