Create new
Bindings
Transitions
Animations
Easing
Component composition
Context API
Special elements
Module context
Debugging
Miscellaneous
App.svelte
runes
This component is in runes mode.
To disable runes mode, add the following to the top of your component:
<svelte:options runes={false} />
99
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
›
⌄
⌄
⌄
⌄
⌄
⌄
⌄
⌄
⌄
<script>
let user = $state({
firstname: 'Santa',
lastname: 'Claus',
avatar: 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNiAzNiI+PHBhdGggZmlsbD0iI0ZGREM1RCIgZD0iTTUgMjFjMCAyLjIwOS0xLjExOSA0LTIuNSA0UzAgMjMuMjA5IDAgMjFzMS4xMTktNCAyLjUtNFM1IDE4Ljc5MSA1IDIxeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0ZGREM1RCIgZD0iTTMgMTguNTYyQzMgMTAuMDM3IDguMzczIDMuMTI1IDE1IDMuMTI1czEyIDYuOTEyIDEyIDE1LjQzOEMyNyAyNy4wODggMjEuNjI3IDM0IDE1IDM0UzMgMjcuMDg4IDMgMTguNTYyeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0REMkU0NCIgZD0iTTIwIDBjLS4yNDkgMC0uNDc4LjAwNy0uNzEzLjAxMkMxOS4xOS4wMSAxOS4wOTcgMCAxOSAwIDkgMCAyIDQuNTgyIDIgOXM2LjM3MyA0IDEzIDRjNC40NDIgMCA3LjY0OCAwIDkuOTY2LS4wODZMMjUgMTNsNiAxNWgycy4zNDMtMy4wNTUgMS03YzEtNiAuNTMzLTIxLTE0LTIxeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0ZGREM1RCIgZD0iTTMwIDIxYzAgMi4yMDktMS4xMTkgNC0yLjUgNFMyNSAyMy4yMDkgMjUgMjFzMS4xMTktNCAyLjUtNCAyLjUgMS43OTEgMi41IDR6Ii8+PHBhdGggeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBmaWxsPSIjNjYyMTEzIiBkPSJNMTAgMjFjLS41NTIgMC0xLS40NDctMS0xdi0yYzAtLjU1Mi40NDgtMSAxLTFzMSAuNDQ4IDEgMXYyYzAgLjU1My0uNDQ4IDEtMSAxem0xMCAwYy0uNTUzIDAtMS0uNDQ3LTEtMXYtMmMwLS41NTIuNDQ3LTEgMS0xczEgLjQ0OCAxIDF2MmMwIC41NTMtLjQ0NyAxLTEgMXoiLz48cGF0aCB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNCNzc1NUUiIGQ9Ik0xNiAyNmgtMmMtLjU1MiAwLTEtLjQ0Ny0xLTFzLjQ0OC0xIDEtMWgyYy41NTIgMCAxIC40NDcgMSAxcy0uNDQ4IDEtMSAxeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0U2RTdFOCIgZD0iTTI3IDI1YzAtMi0yLjI5My0uNzA3LTMgMC0xIDEtMyAzLTUgMi0yLjgyOC0xLjQxNC00LTEtNC0xcy0xLjE3MS0uNDE0LTQgMWMtMiAxLTQtMS01LTItLjcwNy0uNzA3LTMtMi0zIDBzMSAyIDEgMmMtMSAyIDEgMyAxIDMgMCAzIDMgMyAzIDMgMCAzIDQgMiA0IDIgMSAxIDMgMSAzIDFzMiAwIDMtMWMwIDAgNCAxIDQtMiAwIDAgMyAwIDMtMyAwIDAgMi0xIDEtMyAwIDAgMSAwIDEtMnoiLz48cGF0aCB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNGRkRDNUQiIGQ9Ik0xNSAyOGM3IDAgNCAyIDAgMnMtNy0yIDAtMnoiLz48ZWxsaXBzZSB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNEMUQzRDQiIGN4PSIzIiBjeT0iMTQiIHJ4PSIyIiByeT0iNCIvPjxlbGxpcHNlIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0QxRDNENCIgY3g9IjI2IiBjeT0iMTQiIHJ4PSIyIiByeT0iNCIvPjxjaXJjbGUgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBmaWxsPSIjRjFGMkYyIiBjeD0iMzIiIGN5PSIyOSIgcj0iNCIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0YxRjJGMiIgZD0iTTI5IDEyYzAgMS4xMDQtLjg5NiAyLTIgMkgyYy0xLjEwNCAwLTItLjg5Ni0yLTJ2LTFjMC0xLjEwNC44OTYtMiAyLTJoMjVjMS4xMDQgMCAyIC44OTYgMiAydjF6Ii8+PC9zdmc+'
});
</script>
<header>
<img alt="{user.firstname} {user.lastname} avatar" src={user.avatar} />
<h1>Hello {user.firstname} {user.lastname}!</h1>
</header>
<label>
<input bind:value={user.firstname} /> firstname
</label>
<label>
<input bind:value={user.lastname} /> lastname
</label>
<!-- this will trigger a warning with a link -->
<button onclick={() => console.log(user)}>
yule log
</button>
<style>
header {
display: flex;
align-items: center;
gap: 1em;
}
img {
width: 3rem;
height: 3rem;
Error compiling component
WebAssembly.instantiateStreaming(): value type opcode @+13
99
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
›
⌄
⌄
import "svelte/internal/disclose-version";
import * as $ from "svelte/internal/client";
var on_click = (_, user) => console.log(user);
var root = $.template(`<header class="svelte-18ip0y7"><img class="svelte-18ip0y7"> <h1> </h1></header> <label class="svelte-18ip0y7"><input class="svelte-18ip0y7"> firstname</label> <label class="svelte-18ip0y7"><input class="svelte-18ip0y7"> lastname</label> <button class="svelte-18ip0y7">yule log</button>`, 1);
export default function App($$anchor) {
let user = $.proxy({
firstname: 'Santa',
lastname: 'Claus',
avatar: 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNiAzNiI+PHBhdGggZmlsbD0iI0ZGREM1RCIgZD0iTTUgMjFjMCAyLjIwOS0xLjExOSA0LTIuNSA0UzAgMjMuMjA5IDAgMjFzMS4xMTktNCAyLjUtNFM1IDE4Ljc5MSA1IDIxeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0ZGREM1RCIgZD0iTTMgMTguNTYyQzMgMTAuMDM3IDguMzczIDMuMTI1IDE1IDMuMTI1czEyIDYuOTEyIDEyIDE1LjQzOEMyNyAyNy4wODggMjEuNjI3IDM0IDE1IDM0UzMgMjcuMDg4IDMgMTguNTYyeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0REMkU0NCIgZD0iTTIwIDBjLS4yNDkgMC0uNDc4LjAwNy0uNzEzLjAxMkMxOS4xOS4wMSAxOS4wOTcgMCAxOSAwIDkgMCAyIDQuNTgyIDIgOXM2LjM3MyA0IDEzIDRjNC40NDIgMCA3LjY0OCAwIDkuOTY2LS4wODZMMjUgMTNsNiAxNWgycy4zNDMtMy4wNTUgMS03YzEtNiAuNTMzLTIxLTE0LTIxeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0ZGREM1RCIgZD0iTTMwIDIxYzAgMi4yMDktMS4xMTkgNC0yLjUgNFMyNSAyMy4yMDkgMjUgMjFzMS4xMTktNCAyLjUtNCAyLjUgMS43OTEgMi41IDR6Ii8+PHBhdGggeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBmaWxsPSIjNjYyMTEzIiBkPSJNMTAgMjFjLS41NTIgMC0xLS40NDctMS0xdi0yYzAtLjU1Mi40NDgtMSAxLTFzMSAuNDQ4IDEgMXYyYzAgLjU1My0uNDQ4IDEtMSAxem0xMCAwYy0uNTUzIDAtMS0uNDQ3LTEtMXYtMmMwLS41NTIuNDQ3LTEgMS0xczEgLjQ0OCAxIDF2MmMwIC41NTMtLjQ0NyAxLTEgMXoiLz48cGF0aCB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNCNzc1NUUiIGQ9Ik0xNiAyNmgtMmMtLjU1MiAwLTEtLjQ0Ny0xLTFzLjQ0OC0xIDEtMWgyYy41NTIgMCAxIC40NDcgMSAxcy0uNDQ4IDEtMSAxeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0U2RTdFOCIgZD0iTTI3IDI1YzAtMi0yLjI5My0uNzA3LTMgMC0xIDEtMyAzLTUgMi0yLjgyOC0xLjQxNC00LTEtNC0xcy0xLjE3MS0uNDE0LTQgMWMtMiAxLTQtMS01LTItLjcwNy0uNzA3LTMtMi0zIDBzMSAyIDEgMmMtMSAyIDEgMyAxIDMgMCAzIDMgMyAzIDMgMCAzIDQgMiA0IDIgMSAxIDMgMSAzIDFzMiAwIDMtMWMwIDAgNCAxIDQtMiAwIDAgMyAwIDMtMyAwIDAgMi0xIDEtMyAwIDAgMSAwIDEtMnoiLz48cGF0aCB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNGRkRDNUQiIGQ9Ik0xNSAyOGM3IDAgNCAyIDAgMnMtNy0yIDAtMnoiLz48ZWxsaXBzZSB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNEMUQzRDQiIGN4PSIzIiBjeT0iMTQiIHJ4PSIyIiByeT0iNCIvPjxlbGxpcHNlIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0QxRDNENCIgY3g9IjI2IiBjeT0iMTQiIHJ4PSIyIiByeT0iNCIvPjxjaXJjbGUgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBmaWxsPSIjRjFGMkYyIiBjeD0iMzIiIGN5PSIyOSIgcj0iNCIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0YxRjJGMiIgZD0iTTI5IDEyYzAgMS4xMDQtLjg5NiAyLTIgMkgyYy0xLjEwNCAwLTItLjg5Ni0yLTJ2LTFjMC0xLjEwNC44OTYtMiAyLTJoMjVjMS4xMDQgMCAyIC44OTYgMiAydjF6Ii8+PC9zdmc+'
});
var fragment = root();
var header = $.first_child(fragment);
var img = $.child(header);
var h1 = $.sibling(img, 2);
var text = $.child(h1);
$.reset(h1);
$.reset(header);
var label = $.sibling(header, 2);
var input = $.child(label);
$.remove_input_defaults(input);
$.next();
$.reset(label);
var label_1 = $.sibling(label, 2);
var input_1 = $.child(label_1);
$.remove_input_defaults(input_1);
$.next();
$.reset(label_1);
result = svelte.compile(source, {
generate: ,
});99
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
›
header.svelte-18ip0y7 {
display: flex;
align-items: center;
gap: 1em;
}
img.svelte-18ip0y7 {
width: 3rem;
height: 3rem;
}
label.svelte-18ip0y7 {
display: block;
}
input.svelte-18ip0y7, button.svelte-18ip0y7 {
font: inherit;
margin: 0.2em 0;
}
Root {
css: StyleSheet {...}
- type: "StyleSheet"
- start: 2940
- end: 3152
- attributes: []
children: [...] (4)
Rule {...}
- type: "Rule"
prelude: SelectorList {...}
- type: "SelectorList"
- start: 2949
- end: 2955
children: [...] (1)
ComplexSelector {...}
- type: "ComplexSelector"
- start: 2949
- end: 2955
children: [...] (1)
RelativeSelector {...}
- type: "RelativeSelector"
- combinator: null
selectors: [...] (1)
TypeSelector {...}
- type: "TypeSelector"
- name: "header"
- start: 2949
- end: 2955
}
]- start: 2949
- end: 2955
}
]
}
]
}block: Block {...}
- type: "Block"
- start: 2956
- end: 3012
children: [...] (3)
Declaration {...}
- type: "Declaration"
- start: 2960
- end: 2973
- property: "display"
- value: "flex"
} Declaration {...}
- type: "Declaration"
- start: 2977
- end: 2996
- property: "align-items"
- value: "center"
} Declaration {...}
- type: "Declaration"
- start: 3000
- end: 3008
- property: "gap"
- value: "1em"
}
]
}- start: 2949
- end: 3012
} Rule {...}
- type: "Rule"
prelude: SelectorList {...}
- type: "SelectorList"
- start: 3016
- end: 3019
children: [...] (1)
ComplexSelector {...}
- type: "ComplexSelector"
- start: 3016
- end: 3019
children: [...] (1)
RelativeSelector {...}
- type: "RelativeSelector"
- combinator: null
selectors: [...] (1)
TypeSelector {...}
- type: "TypeSelector"
- name: "img"
- start: 3016
- end: 3019
}
]- start: 3016
- end: 3019
}
]
}
]
}block: Block {...}
- type: "Block"
- start: 3020
- end: 3055
children: [...] (2)
Declaration {...}
- type: "Declaration"
- start: 3024
- end: 3035
- property: "width"
- value: "3rem"
} Declaration {...}
- type: "Declaration"
- start: 3039
- end: 3051
- property: "height"
- value: "3rem"
}
]
}- start: 3016
- end: 3055
} Rule {...}
- type: "Rule"
prelude: SelectorList {...}
- type: "SelectorList"
- start: 3058
- end: 3063
children: [...] (1)
ComplexSelector {...}
- type: "ComplexSelector"
- start: 3058
- end: 3063
children: [...] (1)
RelativeSelector {...}
- type: "RelativeSelector"
- combinator: null
selectors: [...] (1)
TypeSelector {...}
- type: "TypeSelector"
- name: "label"
- start: 3058
- end: 3063
}
]- start: 3058
- end: 3063
}
]
}
]
}block: Block {...}
- type: "Block"
- start: 3064
- end: 3086
children: [...] (1)
Declaration {...}
- type: "Declaration"
- start: 3068
- end: 3082
- property: "display"
- value: "block"
}
]
}- start: 3058
- end: 3086
} Rule {...}
- type: "Rule"
prelude: SelectorList {...}
- type: "SelectorList"
- start: 3089
- end: 3102
children: [...] (2)
ComplexSelector {...}
- type: "ComplexSelector"
- start: 3089
- end: 3094
children: [...] (1)
RelativeSelector {...}
- type: "RelativeSelector"
- combinator: null
selectors: [...] (1)
TypeSelector {...}
- type: "TypeSelector"
- name: "input"
- start: 3089
- end: 3094
}
]- start: 3089
- end: 3094
}
]
} ComplexSelector {...}
- type: "ComplexSelector"
- start: 3096
- end: 3102
children: [...] (1)
RelativeSelector {...}
- type: "RelativeSelector"
- combinator: null
selectors: [...] (1)
TypeSelector {...}
- type: "TypeSelector"
- name: "button"
- start: 3096
- end: 3102
}
]- start: 3096
- end: 3102
}
]
}
]
}block: Block {...}
- type: "Block"
- start: 3103
- end: 3143
children: [...] (2)
Declaration {...}
- type: "Declaration"
- start: 3107
- end: 3120
- property: "font"
- value: "inherit"
} Declaration {...}
- type: "Declaration"
- start: 3124
- end: 3139
- property: "margin"
- value: "0.2em 0"
}
]
}- start: 3089
- end: 3143
}
]content: {...}
- start: 2947
- end: 3144
- styles: "\n\theader {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 1em;\n\t}\n\t\n\timg {\n\t\twidth: 3rem;\n\t\theight: 3rem;\n\t}\n\n\tlabel {\n\t\tdisplay: block;\n\t}\n\n\tinput, button {\n\t\tfont: inherit;\n\t\tmargin: 0.2em 0;\n\t}\n"
- comment: null
}
}- js: []
- start: 2552
- end: 2938
- type: "Root"
fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (11)
Text {...}
- type: "Text"
- start: 2550
- end: 2552
- raw: "\n\n"
- data: "\n\n"
} RegularElement {...}
- type: "RegularElement"
- start: 2552
- end: 2693
- name: "header"
attributes: [...] (1)
Attribute {...}
- type: "Attribute"
- start: -1
- end: -1
- name: "class"
value: [...] (1)
Text {...}
- type: "Text"
- data: "svelte-18ip0y7"
- raw: "svelte-18ip0y7"
- start: -1
- end: -1
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (5)
Text {...}
- type: "Text"
- start: 2560
- end: 2562
- raw: "\n\t"
- data: "\n\t"
} RegularElement {...}
- type: "RegularElement"
- start: 2562
- end: 2633
- name: "img"
attributes: [...] (3)
Attribute {...}
- type: "Attribute"
- start: 2567
- end: 2612
- name: "alt"
value: [...] (4)
ExpressionTag {...}
- type: "ExpressionTag"
- start: 2572
- end: 2588
expression: MemberExpression {...}
- type: "MemberExpression"
- start: 2573
- end: 2587
loc: {...}
start: {...}
- line: 10
- column: 12
}end: {...}
- line: 10
- column: 26
}
}object: Identifier {...}
- type: "Identifier"
- start: 2573
- end: 2577
loc: {...}
start: {...}
- line: 10
- column: 12
}end: {...}
- line: 10
- column: 16
}
}- name: "user"
}property: Identifier {...}
- type: "Identifier"
- start: 2578
- end: 2587
loc: {...}
start: {...}
- line: 10
- column: 17
}end: {...}
- line: 10
- column: 26
}
}- name: "firstname"
}- computed: false
- optional: false
}
} Text {...}
- start: 2588
- end: 2589
- type: "Text"
- raw: " "
- data: " "
} ExpressionTag {...}
- type: "ExpressionTag"
- start: 2589
- end: 2604
expression: MemberExpression {...}
- type: "MemberExpression"
- start: 2590
- end: 2603
loc: {...}
start: {...}
- line: 10
- column: 29
}end: {...}
- line: 10
- column: 42
}
}object: Identifier {...}
- type: "Identifier"
- start: 2590
- end: 2594
loc: {...}
start: {...}
- line: 10
- column: 29
}end: {...}
- line: 10
- column: 33
}
}- name: "user"
}property: Identifier {...}
- type: "Identifier"
- start: 2595
- end: 2603
loc: {...}
start: {...}
- line: 10
- column: 34
}end: {...}
- line: 10
- column: 42
}
}- name: "lastname"
}- computed: false
- optional: false
}
} Text {...}
- start: 2604
- end: 2611
- type: "Text"
- raw: " avatar"
- data: " avatar"
}
]
} Attribute {...}
- type: "Attribute"
- start: 2613
- end: 2630
- name: "src"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 2617
- end: 2630
expression: MemberExpression {...}
- type: "MemberExpression"
- start: 2618
- end: 2629
loc: {...}
start: {...}
- line: 10
- column: 57
}end: {...}
- line: 10
- column: 68
}
}object: Identifier {...}
- type: "Identifier"
- start: 2618
- end: 2622
loc: {...}
start: {...}
- line: 10
- column: 57
}end: {...}
- line: 10
- column: 61
}
}- name: "user"
}property: Identifier {...}
- type: "Identifier"
- start: 2623
- end: 2629
loc: {...}
start: {...}
- line: 10
- column: 62
}end: {...}
- line: 10
- column: 68
}
}- name: "avatar"
}- computed: false
- optional: false
}
}
} Attribute {...}
- type: "Attribute"
- start: -1
- end: -1
- name: "class"
value: [...] (1)
Text {...}
- type: "Text"
- data: "svelte-18ip0y7"
- raw: "svelte-18ip0y7"
- start: -1
- end: -1
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
- nodes: []
}
} Text {...}
- type: "Text"
- start: 2633
- end: 2635
- raw: " "
- data: " "
} RegularElement {...}
- type: "RegularElement"
- start: 2635
- end: 2683
- name: "h1"
- attributes: []
fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (5)
Text {...}
- type: "Text"
- start: 2639
- end: 2645
- raw: "Hello "
- data: "Hello "
} ExpressionTag {...}
- type: "ExpressionTag"
- start: 2645
- end: 2661
expression: MemberExpression {...}
- type: "MemberExpression"
- start: 2646
- end: 2660
loc: {...}
start: {...}
- line: 11
- column: 12
}end: {...}
- line: 11
- column: 26
}
}object: Identifier {...}
- type: "Identifier"
- start: 2646
- end: 2650
loc: {...}
start: {...}
- line: 11
- column: 12
}end: {...}
- line: 11
- column: 16
}
}- name: "user"
}property: Identifier {...}
- type: "Identifier"
- start: 2651
- end: 2660
loc: {...}
start: {...}
- line: 11
- column: 17
}end: {...}
- line: 11
- column: 26
}
}- name: "firstname"
}- computed: false
- optional: false
}
} Text {...}
- type: "Text"
- start: 2661
- end: 2662
- raw: " "
- data: " "
} ExpressionTag {...}
- type: "ExpressionTag"
- start: 2662
- end: 2677
expression: MemberExpression {...}
- type: "MemberExpression"
- start: 2663
- end: 2676
loc: {...}
start: {...}
- line: 11
- column: 29
}end: {...}
- line: 11
- column: 42
}
}object: Identifier {...}
- type: "Identifier"
- start: 2663
- end: 2667
loc: {...}
start: {...}
- line: 11
- column: 29
}end: {...}
- line: 11
- column: 33
}
}- name: "user"
}property: Identifier {...}
- type: "Identifier"
- start: 2668
- end: 2676
loc: {...}
start: {...}
- line: 11
- column: 34
}end: {...}
- line: 11
- column: 42
}
}- name: "lastname"
}- computed: false
- optional: false
}
} Text {...}
- type: "Text"
- start: 2677
- end: 2678
- raw: "!"
- data: "!"
}
]
}
} Text {...}
- type: "Text"
- start: 2683
- end: 2684
- raw: "\n"
- data: "\n"
}
]
}
} Text {...}
- type: "Text"
- start: 2693
- end: 2695
- raw: " "
- data: " "
} RegularElement {...}
- type: "RegularElement"
- start: 2695
- end: 2760
- name: "label"
attributes: [...] (1)
Attribute {...}
- type: "Attribute"
- start: -1
- end: -1
- name: "class"
value: [...] (1)
Text {...}
- type: "Text"
- data: "svelte-18ip0y7"
- raw: "svelte-18ip0y7"
- start: -1
- end: -1
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (3)
Text {...}
- type: "Text"
- start: 2702
- end: 2704
- raw: "\n\t"
- data: "\n\t"
} RegularElement {...}
- type: "RegularElement"
- start: 2704
- end: 2741
- name: "input"
attributes: [...] (2)
BindDirective {...}
- start: 2711
- end: 2738
- type: "BindDirective"
- name: "value"
expression: MemberExpression {...}
- type: "MemberExpression"
- start: 2723
- end: 2737
loc: {...}
start: {...}
- line: 15
- column: 20
}end: {...}
- line: 15
- column: 34
}
}object: Identifier {...}
- type: "Identifier"
- start: 2723
- end: 2727
loc: {...}
start: {...}
- line: 15
- column: 20
}end: {...}
- line: 15
- column: 24
}
}- name: "user"
}property: Identifier {...}
- type: "Identifier"
- start: 2728
- end: 2737
loc: {...}
start: {...}
- line: 15
- column: 25
}end: {...}
- line: 15
- column: 34
}
}- name: "firstname"
}- computed: false
- optional: false
}- modifiers: []
} Attribute {...}
- type: "Attribute"
- start: -1
- end: -1
- name: "class"
value: [...] (1)
Text {...}
- type: "Text"
- data: "svelte-18ip0y7"
- raw: "svelte-18ip0y7"
- start: -1
- end: -1
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
- nodes: []
}
} Text {...}
- type: "Text"
- start: 2741
- end: 2752
- raw: " firstname"
- data: " firstname"
}
]
}
} Text {...}
- type: "Text"
- start: 2760
- end: 2762
- raw: " "
- data: " "
} RegularElement {...}
- type: "RegularElement"
- start: 2762
- end: 2825
- name: "label"
attributes: [...] (1)
Attribute {...}
- type: "Attribute"
- start: -1
- end: -1
- name: "class"
value: [...] (1)
Text {...}
- type: "Text"
- data: "svelte-18ip0y7"
- raw: "svelte-18ip0y7"
- start: -1
- end: -1
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (3)
Text {...}
- type: "Text"
- start: 2769
- end: 2771
- raw: "\n\t"
- data: "\n\t"
} RegularElement {...}
- type: "RegularElement"
- start: 2771
- end: 2807
- name: "input"
attributes: [...] (2)
BindDirective {...}
- start: 2778
- end: 2804
- type: "BindDirective"
- name: "value"
expression: MemberExpression {...}
- type: "MemberExpression"
- start: 2790
- end: 2803
loc: {...}
start: {...}
- line: 19
- column: 20
}end: {...}
- line: 19
- column: 33
}
}object: Identifier {...}
- type: "Identifier"
- start: 2790
- end: 2794
loc: {...}
start: {...}
- line: 19
- column: 20
}end: {...}
- line: 19
- column: 24
}
}- name: "user"
}property: Identifier {...}
- type: "Identifier"
- start: 2795
- end: 2803
loc: {...}
start: {...}
- line: 19
- column: 25
}end: {...}
- line: 19
- column: 33
}
}- name: "lastname"
}- computed: false
- optional: false
}- modifiers: []
} Attribute {...}
- type: "Attribute"
- start: -1
- end: -1
- name: "class"
value: [...] (1)
Text {...}
- type: "Text"
- data: "svelte-18ip0y7"
- raw: "svelte-18ip0y7"
- start: -1
- end: -1
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
- nodes: []
}
} Text {...}
- type: "Text"
- start: 2807
- end: 2817
- raw: " lastname"
- data: " lastname"
}
]
}
} Text {...}
- type: "Text"
- start: 2825
- end: 2827
- raw: " "
- data: " "
} Comment {...}
- type: "Comment"
- start: 2827
- end: 2875
- data: " this will trigger a warning with a link "
} Text {...}
- type: "Text"
- start: 2875
- end: 2876
- raw: ""
- data: ""
} RegularElement {...}
- type: "RegularElement"
- start: 2876
- end: 2938
- name: "button"
attributes: [...] (2)
Attribute {...}
- type: "Attribute"
- start: 2884
- end: 2917
- name: "onclick"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 2892
- end: 2917
expression: ArrowFunctionExpression {...}
- type: "ArrowFunctionExpression"
- start: 2893
- end: 2916
loc: {...}
start: {...}
- line: 23
- column: 17
}end: {...}
- line: 23
- column: 40
}
}- id: null
- expression: true
- generator: false
- async: false
- params: []
body: CallExpression {...}
- type: "CallExpression"
- start: 2899
- end: 2916
loc: {...}
start: {...}
- line: 23
- column: 23
}end: {...}
- line: 23
- column: 40
}
}callee: MemberExpression {...}
- type: "MemberExpression"
- start: 2899
- end: 2910
loc: {...}
start: {...}
- line: 23
- column: 23
}end: {...}
- line: 23
- column: 34
}
}object: Identifier {...}
- type: "Identifier"
- start: 2899
- end: 2906
loc: {...}
start: {...}
- line: 23
- column: 23
}end: {...}
- line: 23
- column: 30
}
}- name: "console"
}property: Identifier {...}
- type: "Identifier"
- start: 2907
- end: 2910
loc: {...}
start: {...}
- line: 23
- column: 31
}end: {...}
- line: 23
- column: 34
}
}- name: "log"
}- computed: false
- optional: false
}arguments: [...] (1)
Identifier {...}
- type: "Identifier"
- start: 2911
- end: 2915
loc: {...}
start: {...}
- line: 23
- column: 35
}end: {...}
- line: 23
- column: 39
}
}- name: "user"
}
]- optional: false
}
}
}
} Attribute {...}
- type: "Attribute"
- start: -1
- end: -1
- name: "class"
value: [...] (1)
Text {...}
- type: "Text"
- data: "svelte-18ip0y7"
- raw: "svelte-18ip0y7"
- start: -1
- end: -1
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (1)
Text {...}
- type: "Text"
- start: 2918
- end: 2929
- raw: "yule log"
- data: "yule log"
}
]
}
} Text {...}
- type: "Text"
- start: 2938
- end: 2940
- raw: "\n\n"
- data: "\n\n"
}
]
}- options: null
instance: Script {...}
- type: "Script"
- start: 0
- end: 2550
- context: "default"
content: Program {...}
- type: "Program"
- start: 8
- end: 2541
loc: {...}
start: {...}
- line: 1
- column: 0
}end: {...}
- line: 7
- column: 0
}
}body: [...] (1)
VariableDeclaration {...}
- type: "VariableDeclaration"
- start: 10
- end: 2540
loc: {...}
start: {...}
- line: 2
- column: 1
}end: {...}
- line: 6
- column: 4
}
}declarations: [...] (1)
VariableDeclarator {...}
- type: "VariableDeclarator"
- start: 14
- end: 2539
loc: {...}
start: {...}
- line: 2
- column: 5
}end: {...}
- line: 6
- column: 3
}
}id: Identifier {...}
- type: "Identifier"
- start: 14
- end: 18
loc: {...}
start: {...}
- line: 2
- column: 5
}end: {...}
- line: 2
- column: 9
}
}- name: "user"
}init: CallExpression {...}
- type: "CallExpression"
- start: 21
- end: 2539
loc: {...}
start: {...}
- line: 2
- column: 12
}end: {...}
- line: 6
- column: 3
}
}callee: Identifier {...}
- type: "Identifier"
- start: 21
- end: 27
loc: {...}
start: {...}
- line: 2
- column: 12
}end: {...}
- line: 2
- column: 18
}
}- name: "$state"
}arguments: [...] (1)
ObjectExpression {...}
- type: "ObjectExpression"
- start: 28
- end: 2538
loc: {...}
start: {...}
- line: 2
- column: 19
}end: {...}
- line: 6
- column: 2
}
}properties: [...] (3)
Property {...}
- type: "Property"
- start: 32
- end: 50
loc: {...}
start: {...}
- line: 3
- column: 2
}end: {...}
- line: 3
- column: 20
}
}- method: false
- shorthand: false
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 32
- end: 41
loc: {...}
start: {...}
- line: 3
- column: 2
}end: {...}
- line: 3
- column: 11
}
}- name: "firstname"
}value: Literal {...}
- type: "Literal"
- start: 43
- end: 50
loc: {...}
start: {...}
- line: 3
- column: 13
}end: {...}
- line: 3
- column: 20
}
}- value: "Santa"
- raw: "'Santa'"
}- kind: "init"
} Property {...}
- type: "Property"
- start: 54
- end: 71
loc: {...}
start: {...}
- line: 4
- column: 2
}end: {...}
- line: 4
- column: 19
}
}- method: false
- shorthand: false
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 54
- end: 62
loc: {...}
start: {...}
- line: 4
- column: 2
}end: {...}
- line: 4
- column: 10
}
}- name: "lastname"
}value: Literal {...}
- type: "Literal"
- start: 64
- end: 71
loc: {...}
start: {...}
- line: 4
- column: 12
}end: {...}
- line: 4
- column: 19
}
}- value: "Claus"
- raw: "'Claus'"
}- kind: "init"
} Property {...}
- type: "Property"
- start: 75
- end: 2535
loc: {...}
start: {...}
- line: 5
- column: 2
}end: {...}
- line: 5
- column: 2462
}
}- method: false
- shorthand: false
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 75
- end: 81
loc: {...}
start: {...}
- line: 5
- column: 2
}end: {...}
- line: 5
- column: 8
}
}- name: "avatar"
}value: Literal {...}
- type: "Literal"
- start: 83
- end: 2535
loc: {...}
start: {...}
- line: 5
- column: 10
}end: {...}
- line: 5
- column: 2462
}
}- value: "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNiAzNiI+PHBhdGggZmlsbD0iI0ZGREM1RCIgZD0iTTUgMjFjMCAyLjIwOS0xLjExOSA0LTIuNSA0UzAgMjMuMjA5IDAgMjFzMS4xMTktNCAyLjUtNFM1IDE4Ljc5MSA1IDIxeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0ZGREM1RCIgZD0iTTMgMTguNTYyQzMgMTAuMDM3IDguMzczIDMuMTI1IDE1IDMuMTI1czEyIDYuOTEyIDEyIDE1LjQzOEMyNyAyNy4wODggMjEuNjI3IDM0IDE1IDM0UzMgMjcuMDg4IDMgMTguNTYyeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0REMkU0NCIgZD0iTTIwIDBjLS4yNDkgMC0uNDc4LjAwNy0uNzEzLjAxMkMxOS4xOS4wMSAxOS4wOTcgMCAxOSAwIDkgMCAyIDQuNTgyIDIgOXM2LjM3MyA0IDEzIDRjNC40NDIgMCA3LjY0OCAwIDkuOTY2LS4wODZMMjUgMTNsNiAxNWgycy4zNDMtMy4wNTUgMS03YzEtNiAuNTMzLTIxLTE0LTIxeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0ZGREM1RCIgZD0iTTMwIDIxYzAgMi4yMDktMS4xMTkgNC0yLjUgNFMyNSAyMy4yMDkgMjUgMjFzMS4xMTktNCAyLjUtNCAyLjUgMS43OTEgMi41IDR6Ii8+PHBhdGggeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBmaWxsPSIjNjYyMTEzIiBkPSJNMTAgMjFjLS41NTIgMC0xLS40NDctMS0xdi0yYzAtLjU1Mi40NDgtMSAxLTFzMSAuNDQ4IDEgMXYyYzAgLjU1My0uNDQ4IDEtMSAxem0xMCAwYy0uNTUzIDAtMS0uNDQ3LTEtMXYtMmMwLS41NTIuNDQ3LTEgMS0xczEgLjQ0OCAxIDF2MmMwIC41NTMtLjQ0NyAxLTEgMXoiLz48cGF0aCB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNCNzc1NUUiIGQ9Ik0xNiAyNmgtMmMtLjU1MiAwLTEtLjQ0Ny0xLTFzLjQ0OC0xIDEtMWgyYy41NTIgMCAxIC40NDcgMSAxcy0uNDQ4IDEtMSAxeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0U2RTdFOCIgZD0iTTI3IDI1YzAtMi0yLjI5My0uNzA3LTMgMC0xIDEtMyAzLTUgMi0yLjgyOC0xLjQxNC00LTEtNC0xcy0xLjE3MS0uNDE0LTQgMWMtMiAxLTQtMS01LTItLjcwNy0uNzA3LTMtMi0zIDBzMSAyIDEgMmMtMSAyIDEgMyAxIDMgMCAzIDMgMyAzIDMgMCAzIDQgMiA0IDIgMSAxIDMgMSAzIDFzMiAwIDMtMWMwIDAgNCAxIDQtMiAwIDAgMyAwIDMtMyAwIDAgMi0xIDEtMyAwIDAgMSAwIDEtMnoiLz48cGF0aCB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNGRkRDNUQiIGQ9Ik0xNSAyOGM3IDAgNCAyIDAgMnMtNy0yIDAtMnoiLz48ZWxsaXBzZSB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNEMUQzRDQiIGN4PSIzIiBjeT0iMTQiIHJ4PSIyIiByeT0iNCIvPjxlbGxpcHNlIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0QxRDNENCIgY3g9IjI2IiBjeT0iMTQiIHJ4PSIyIiByeT0iNCIvPjxjaXJjbGUgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBmaWxsPSIjRjFGMkYyIiBjeD0iMzIiIGN5PSIyOSIgcj0iNCIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0YxRjJGMiIgZD0iTTI5IDEyYzAgMS4xMDQtLjg5NiAyLTIgMkgyYy0xLjEwNCAwLTItLjg5Ni0yLTJ2LTFjMC0xLjEwNC44OTYtMiAyLTJoMjVjMS4xMDQgMCAyIC44OTYgMiAydjF6Ii8+PC9zdmc+"
- raw: "'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNiAzNiI+PHBhdGggZmlsbD0iI0ZGREM1RCIgZD0iTTUgMjFjMCAyLjIwOS0xLjExOSA0LTIuNSA0UzAgMjMuMjA5IDAgMjFzMS4xMTktNCAyLjUtNFM1IDE4Ljc5MSA1IDIxeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0ZGREM1RCIgZD0iTTMgMTguNTYyQzMgMTAuMDM3IDguMzczIDMuMTI1IDE1IDMuMTI1czEyIDYuOTEyIDEyIDE1LjQzOEMyNyAyNy4wODggMjEuNjI3IDM0IDE1IDM0UzMgMjcuMDg4IDMgMTguNTYyeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0REMkU0NCIgZD0iTTIwIDBjLS4yNDkgMC0uNDc4LjAwNy0uNzEzLjAxMkMxOS4xOS4wMSAxOS4wOTcgMCAxOSAwIDkgMCAyIDQuNTgyIDIgOXM2LjM3MyA0IDEzIDRjNC40NDIgMCA3LjY0OCAwIDkuOTY2LS4wODZMMjUgMTNsNiAxNWgycy4zNDMtMy4wNTUgMS03YzEtNiAuNTMzLTIxLTE0LTIxeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0ZGREM1RCIgZD0iTTMwIDIxYzAgMi4yMDktMS4xMTkgNC0yLjUgNFMyNSAyMy4yMDkgMjUgMjFzMS4xMTktNCAyLjUtNCAyLjUgMS43OTEgMi41IDR6Ii8+PHBhdGggeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBmaWxsPSIjNjYyMTEzIiBkPSJNMTAgMjFjLS41NTIgMC0xLS40NDctMS0xdi0yYzAtLjU1Mi40NDgtMSAxLTFzMSAuNDQ4IDEgMXYyYzAgLjU1My0uNDQ4IDEtMSAxem0xMCAwYy0uNTUzIDAtMS0uNDQ3LTEtMXYtMmMwLS41NTIuNDQ3LTEgMS0xczEgLjQ0OCAxIDF2MmMwIC41NTMtLjQ0NyAxLTEgMXoiLz48cGF0aCB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNCNzc1NUUiIGQ9Ik0xNiAyNmgtMmMtLjU1MiAwLTEtLjQ0Ny0xLTFzLjQ0OC0xIDEtMWgyYy41NTIgMCAxIC40NDcgMSAxcy0uNDQ4IDEtMSAxeiIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0U2RTdFOCIgZD0iTTI3IDI1YzAtMi0yLjI5My0uNzA3LTMgMC0xIDEtMyAzLTUgMi0yLjgyOC0xLjQxNC00LTEtNC0xcy0xLjE3MS0uNDE0LTQgMWMtMiAxLTQtMS01LTItLjcwNy0uNzA3LTMtMi0zIDBzMSAyIDEgMmMtMSAyIDEgMyAxIDMgMCAzIDMgMyAzIDMgMCAzIDQgMiA0IDIgMSAxIDMgMSAzIDFzMiAwIDMtMWMwIDAgNCAxIDQtMiAwIDAgMyAwIDMtMyAwIDAgMi0xIDEtMyAwIDAgMSAwIDEtMnoiLz48cGF0aCB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNGRkRDNUQiIGQ9Ik0xNSAyOGM3IDAgNCAyIDAgMnMtNy0yIDAtMnoiLz48ZWxsaXBzZSB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNEMUQzRDQiIGN4PSIzIiBjeT0iMTQiIHJ4PSIyIiByeT0iNCIvPjxlbGxpcHNlIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0QxRDNENCIgY3g9IjI2IiBjeT0iMTQiIHJ4PSIyIiByeT0iNCIvPjxjaXJjbGUgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBmaWxsPSIjRjFGMkYyIiBjeD0iMzIiIGN5PSIyOSIgcj0iNCIvPjxwYXRoIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iI0YxRjJGMiIgZD0iTTI5IDEyYzAgMS4xMDQtLjg5NiAyLTIgMkgyYy0xLjEwNCAwLTItLjg5Ni0yLTJ2LTFjMC0xLjEwNC44OTYtMiAyLTJoMjVjMS4xMDQgMCAyIC44OTYgMiAydjF6Ii8+PC9zdmc+'"
}- kind: "init"
}
]
}
]- optional: false
}
}
]- kind: "let"
}
]- sourceType: "module"
}- attributes: []
}
}
The AST is not public API and may change at any point in time