Skip to main content
Create new
Introduction
Reactivity
Props
Logic
Events
Bindings
Lifecycle
Stores
Motion
Transitions
Animations
Easing
SVG
Actions
Classes
Component composition
Context API
Special elements
Module context
Debugging
7GUIs
Miscellaneous
App.svelte
<style>
.example > * + * {
color: purple;
}
</style>

<div class="example">
<p>
Sibling
</p>
<p>
Second sibling
</p>
</div>

Error compiling component

WebAssembly.instantiateStreaming(): value type opcode @+13
/* App.svelte generated by Svelte v3.29.0 */
import {
SvelteComponent,
append,
attr,
detach,
element,
init,
insert,
noop,
safe_not_equal
} from "svelte/internal";

function add_css() {
var style = element("style");
style.id = "svelte-1d3g6cm-style";
style.textContent = ".example.svelte-1d3g6cm>.svelte-1d3g6cm+.svelte-1d3g6cm{color:purple}";
append(document.head, style);
}

function create_fragment(ctx) {
let div;

return {
c() {
div = element("div");

div.innerHTML = `<p class="svelte-1d3g6cm">Sibling</p>
<p class="svelte-1d3g6cm">Second sibling</p>`;

attr(div, "class", "example svelte-1d3g6cm");
},
m(target, anchor) {
insert(target, div, anchor);
},
p: noop,
result = svelte.compile(source, {
generate: ,
});
.example.svelte-1d3g6cm>.svelte-1d3g6cm+.svelte-1d3g6cm{color:purple}
		
			
				
  • {
    • html: Fragment {...}
      • start: 58
      • end: 135
      • type: "Fragment"
      • children: [...] (2)
        • Text {...}
          • start: 56
          • end: 58
          • type: "Text"
          • raw: "\n\n"
          • data: "\n\n"
          }
        • Element {...}
          • start: 58
          • end: 135
          • type: "Element"
          • name: "div"
          • attributes: [...] (1)
            • Attribute {...}
              • start: 63
              • end: 78
              • type: "Attribute"
              • name: "class"
              • value: [...] (1)
                • Text {...}
                  • start: 70
                  • end: 77
                  • type: "Text"
                  • raw: "example"
                  • data: "example svelte-1d3g6cm"
                  }
                ]
              }
            ]
          • children: [...] (5)
            • Text {...}
              • start: 79
              • end: 81
              • type: "Text"
              • raw: "\n\t"
              • data: "\n\t"
              }
            • Element {...}
              • start: 81
              • end: 100
              • type: "Element"
              • name: "p"
              • attributes: []
              • children: [...] (1)
                • Text {...}
                  • start: 84
                  • end: 96
                  • type: "Text"
                  • raw: "\n\t\tSibling\n\t"
                  • data: "\n\t\tSibling\n\t"
                  }
                ]
              }
            • Text {...}
              • start: 100
              • end: 102
              • type: "Text"
              • raw: "\n\t"
              • data: "\n\t"
              }
            • Element {...}
              • start: 102
              • end: 128
              • type: "Element"
              • name: "p"
              • attributes: []
              • children: [...] (1)
                • Text {...}
                  • start: 105
                  • end: 124
                  • type: "Text"
                  • raw: "\n\t\tSecond sibling\n\t"
                  • data: "\n\t\tSecond sibling\n\t"
                  }
                ]
              }
            • Text {...}
              • start: 128
              • end: 129
              • type: "Text"
              • raw: "\n"
              • data: "\n"
              }
            ]
          }
        ]
      }
    • css: Style {...}
      • type: "Style"
      • start: 0
      • end: 56
      • attributes: []
      • children: [...] (1)
        • Rule {...}
          • type: "Rule"
          • selector: SelectorList {...}
            • type: "SelectorList"
            • children: [...] (1)
              • Selector {...}
                • type: "Selector"
                • children: [...] (5)
                  • ClassSelector {...}
                    • type: "ClassSelector"
                    • name: "example"
                    • start: 9
                    • end: 17
                    }
                  • Combinator {...}
                    • type: "Combinator"
                    • name: ">"
                    • start: 18
                    • end: 19
                    }
                  • TypeSelector {...}
                    • type: "TypeSelector"
                    • name: "*"
                    • start: 20
                    • end: 21
                    }
                  • Combinator {...}
                    • type: "Combinator"
                    • name: "+"
                    • start: 22
                    • end: 23
                    }
                  • TypeSelector {...}
                    • type: "TypeSelector"
                    • name: "*"
                    • start: 24
                    • end: 25
                    }
                  ]
                • start: 9
                • end: 25
                }
              ]
            • start: 9
            • end: 25
            }
          • block: Block {...}
            • type: "Block"
            • children: [...] (1)
              • Declaration {...}
                • type: "Declaration"
                • important: false
                • property: "color"
                • value: Value {...}
                  • type: "Value"
                  • children: [...] (1)
                    • Identifier {...}
                      • type: "Identifier"
                      • name: "purple"
                      • start: 37
                      • end: 43
                      }
                    ]
                  • start: 36
                  • end: 43
                  }
                • start: 30
                • end: 43
                }
              ]
            • start: 26
            • end: 47
            }
          • start: 9
          • end: 47
          }
        ]
      • content: {...}
        • start: 7
        • end: 48
        • styles: "\n\t.example > * + * {\n\t\tcolor: purple;\n\t}\n"
        }
      }
    • instance: undefined
    • module: undefined
    }
The AST is not public API and may change at any point in time