Adding *.svelte to the list of registered patterns of a file type where JavaScript breakpoints are supported (JavaScript, HTML, TypeScript, etc.) in Settings | Editor | File Types is the only way to go
Thanks for the answer, but it doesn't seem to work. I added new file type and registered in the list of supported types but that changed nothing, I still cannot set breakpoints. Is this a bug or I failed to configure it properly?
if I follow your procedure, webstorm displays a dialog with the following choice:
"this wildcard is already registrered by 'Svelte Component' filetype"
if I reassign wildcard, breakpoints are enabled. however I have a side effect in the "div" part of my svelte component.
between a "word of code" (see div example) and the other word of code, therefore in a single space, a red error underline appears, the errors reported are of a different nature, but it is obvious that the svelte plugin no longer works.
if you want to test this simple code, call it: "test.svelte"
hello Elena, so as far as you write, I understand that at the moment there is no way to work quickly in webstorm. are you planning to support this emerging technology in the future?
Svelte is officially supported since the 2022.3 release.
To debug Svelte app, you need to start it (with npm run dev, or whatever command you normally use) and then set breakpoints in .svelte files and use the JavaScript Debug run configuration with your server URL (http://localhost:5173/, http://localhost:8080) to debug the application
Adding *.svelte to the list of registered patterns of a file type where JavaScript breakpoints are supported (JavaScript, HTML, TypeScript, etc.) in Settings | Editor | File Types is the only way to go
Thanks for the answer, but it doesn't seem to work. I added new file type and registered in the list of supported types but that changed nothing, I still cannot set breakpoints. Is this a bug or I failed to configure it properly?
You shouldn't have created a new file type, you should have added .svelte to the list of registered patterns of JavaScript file type. It does work
see: https://plugins.jetbrains.com/plugin/12375-svelte/
if I follow your procedure, webstorm displays a dialog with the following choice:
"this wildcard is already registrered by 'Svelte Component' filetype"
if I reassign wildcard, breakpoints are enabled.
however I have a side effect in the "div" part of my svelte component.
between a "word of code" (see div example) and the other word of code, therefore in a single space, a red error underline appears, the errors reported are of a different nature, but it is obvious that the svelte plugin no longer works.
if you want to test this simple code, call it: "test.svelte"
<script>
export let count = 0
const incrementCount = () => {
count = count + 1
}
$: console.log (`the count is $ {count}`)
</ script>
<div>
{count} <button onclick = {incrementCount ()}> click for increment value of +1 </button>
</ div>
>"this wildcard is already registrered by 'Svelte Component' filetype"
this is expected, as Svelte plugin assigns *.svelte pattern to 'Svelte Component' filetype;
> the errors reported are of a different nature, but it is obvious that the svelte plugin no longer works.
sure, as the file is now treated as pure .html file, and svelte-specific syntax is not recognized
hello Elena,
so as far as you write, I understand that at the moment there is no way to work quickly in webstorm. are you planning to support this emerging technology in the future?
Do you mean providing Svelte support? it's not in our nearest plans, sorry. See https://youtrack.jetbrains.com/issue/WEB-27366#focus=streamItem-27-3757380.0-0
Svelte is officially supported since the 2022.3 release.
To debug Svelte app, you need to start it (with
npm run dev, or whatever command you normally use) and then set breakpoints in.sveltefiles and use the JavaScript Debug run configuration with your server URL (http://localhost:5173/, http://localhost:8080) to debug the applicationPlease see Svelte | WebStorm Documentation (jetbrains.com) for more information