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
NavLink.svelte
NavLink2.svelte
hash.js
<script>
import NavLink from './NavLink.svelte'
import NavLink2 from './NavLink2.svelte'
import hash from './hash'

window.location.hash = '#/'
</script>

<nav>
<div>
<NavLink href="#/">Home</NavLink>
<NavLink href="#/long">A Very Long Name</NavLink>
<NavLink href="#/articles">Articles</NavLink>
</div>
<div>
<NavLink2 href="#/">Home</NavLink2>
<NavLink2 href="#/long">A Very Long Name</NavLink2>
<NavLink2 href="#/articles">Articles</NavLink2>
</div>
</nav>

{#if $hash === '#/articles'}
<p>Articles</p>
{:else if $hash === '#/long'}
<p>Long Indeed</p>
{:else}
<p>Home</p>
{/if}

<style>
nav {
text-align: center;
}
</style>

Error compiling component

WebAssembly.instantiateStreaming(): value type opcode @+13
/* App.svelte generated by Svelte v3.29.7 */
import {
SvelteComponent,
append,
attr,
component_subscribe,
create_component,
destroy_component,
detach,
element,
empty,
init,
insert,
mount_component,
safe_not_equal,
space,
text,
transition_in,
transition_out
} from "svelte/internal";

import NavLink from "./NavLink.svelte";
import NavLink2 from "./NavLink2.svelte";
import hash from "./hash";

function add_css() {
var style = element("style");
style.id = "svelte-qxf0b-style";
style.textContent = "nav.svelte-qxf0b{text-align:center}";
append(document.head, style);
}

// (11:2) <NavLink href="#/">
function create_default_slot_5(ctx) {
let t;

result = svelte.compile(source, {
generate: ,
});
nav.svelte-qxf0b{text-align:center}
		
			
				
  • {
    • html: Fragment {...}
      • start: 159
      • end: 603
      • type: "Fragment"
      • children: [...] (5)
        • Text {...}
          • start: 157
          • end: 159
          • type: "Text"
          • raw: "\n\n"
          • data: "\n\n"
          }
        • Element {...}
          • start: 159
          • end: 479
          • type: "Element"
          • name: "nav"
          • attributes: []
          • children: [...] (5)
            • Text {...}
              • start: 164
              • end: 166
              • type: "Text"
              • raw: "\n\t"
              • data: "\n\t"
              }
            • Element {...}
              • start: 166
              • end: 315
              • type: "Element"
              • name: "div"
              • attributes: []
              • children: [...] (7)
                • Text {...}
                  • start: 171
                  • end: 174
                  • type: "Text"
                  • raw: "\n\t\t"
                  • data: "\n\t\t"
                  }
                • InlineComponent {...}
                  • start: 174
                  • end: 207
                  • type: "InlineComponent"
                  • name: "NavLink"
                  • attributes: [...] (1)
                    • Attribute {...}
                      • start: 183
                      • end: 192
                      • type: "Attribute"
                      • name: "href"
                      • value: [...] (1)
                        • Text {...}
                          • start: 189
                          • end: 191
                          • type: "Text"
                          • raw: "#/"
                          • data: "#/"
                          }
                        ]
                      }
                    ]
                  • children: [...] (1)
                    • Text {...}
                      • start: 193
                      • end: 197
                      • type: "Text"
                      • raw: "Home"
                      • data: "Home"
                      }
                    ]
                  }
                • Text {...}
                  • start: 207
                  • end: 210
                  • type: "Text"
                  • raw: "\n\t\t"
                  • data: "\n\t\t"
                  }
                • InlineComponent {...}
                  • start: 210
                  • end: 259
                  • type: "InlineComponent"
                  • name: "NavLink"
                  • attributes: [...] (1)
                    • Attribute {...}
                      • start: 219
                      • end: 232
                      • type: "Attribute"
                      • name: "href"
                      • value: [...] (1)
                        • Text {...}
                          • start: 225
                          • end: 231
                          • type: "Text"
                          • raw: "#/long"
                          • data: "#/long"
                          }
                        ]
                      }
                    ]
                  • children: [...] (1)
                    • Text {...}
                      • start: 233
                      • end: 249
                      • type: "Text"
                      • raw: "A Very Long Name"
                      • data: "A Very Long Name"
                      }
                    ]
                  }
                • Text {...}
                  • start: 259
                  • end: 262
                  • type: "Text"
                  • raw: "\n\t\t"
                  • data: "\n\t\t"
                  }
                • InlineComponent {...}
                  • start: 262
                  • end: 307
                  • type: "InlineComponent"
                  • name: "NavLink"
                  • attributes: [...] (1)
                    • Attribute {...}
                      • start: 271
                      • end: 288
                      • type: "Attribute"
                      • name: "href"
                      • value: [...] (1)
                        • Text {...}
                          • start: 277
                          • end: 287
                          • type: "Text"
                          • raw: "#/articles"
                          • data: "#/articles"
                          }
                        ]
                      }
                    ]
                  • children: [...] (1)
                    • Text {...}
                      • start: 289
                      • end: 297
                      • type: "Text"
                      • raw: "Articles"
                      • data: "Articles"
                      }
                    ]
                  }
                • Text {...}
                  • start: 307
                  • end: 309
                  • type: "Text"
                  • raw: "\n\t"
                  • data: "\n\t"
                  }
                ]
              }
            • Text {...}
              • start: 315
              • end: 317
              • type: "Text"
              • raw: "\n\t"
              • data: "\n\t"
              }
            • Element {...}
              • start: 317
              • end: 472
              • type: "Element"
              • name: "div"
              • attributes: []
              • children: [...] (7)
                • Text {...}
                  • start: 322
                  • end: 325
                  • type: "Text"
                  • raw: "\n\t\t"
                  • data: "\n\t\t"
                  }
                • InlineComponent {...}
                  • start: 325
                  • end: 360
                  • type: "InlineComponent"
                  • name: "NavLink2"
                  • attributes: [...] (1)
                    • Attribute {...}
                      • start: 335
                      • end: 344
                      • type: "Attribute"
                      • name: "href"
                      • value: [...] (1)
                        • Text {...}
                          • start: 341
                          • end: 343
                          • type: "Text"
                          • raw: "#/"
                          • data: "#/"
                          }
                        ]
                      }
                    ]
                  • children: [...] (1)
                    • Text {...}
                      • start: 345
                      • end: 349
                      • type: "Text"
                      • raw: "Home"
                      • data: "Home"
                      }
                    ]
                  }
                • Text {...}
                  • start: 360
                  • end: 363
                  • type: "Text"
                  • raw: "\n\t\t"
                  • data: "\n\t\t"
                  }
                • InlineComponent {...}
                  • start: 363
                  • end: 414
                  • type: "InlineComponent"
                  • name: "NavLink2"
                  • attributes: [...] (1)
                    • Attribute {...}
                      • start: 373
                      • end: 386
                      • type: "Attribute"
                      • name: "href"
                      • value: [...] (1)
                        • Text {...}
                          • start: 379
                          • end: 385
                          • type: "Text"
                          • raw: "#/long"
                          • data: "#/long"
                          }
                        ]
                      }
                    ]
                  • children: [...] (1)
                    • Text {...}
                      • start: 387
                      • end: 403
                      • type: "Text"
                      • raw: "A Very Long Name"
                      • data: "A Very Long Name"
                      }
                    ]
                  }
                • Text {...}
                  • start: 414
                  • end: 417
                  • type: "Text"
                  • raw: "\n\t\t"
                  • data: "\n\t\t"
                  }
                • InlineComponent {...}
                  • start: 417
                  • end: 464
                  • type: "InlineComponent"
                  • name: "NavLink2"
                  • attributes: [...] (1)
                    • Attribute {...}
                      • start: 427
                      • end: 444
                      • type: "Attribute"
                      • name: "href"
                      • value: [...] (1)
                        • Text {...}
                          • start: 433
                          • end: 443
                          • type: "Text"
                          • raw: "#/articles"
                          • data: "#/articles"
                          }
                        ]
                      }
                    ]
                  • children: [...] (1)
                    • Text {...}
                      • start: 445
                      • end: 453
                      • type: "Text"
                      • raw: "Articles"
                      • data: "Articles"
                      }
                    ]
                  }
                • Text {...}
                  • start: 464
                  • end: 466
                  • type: "Text"
                  • raw: "\n\t"
                  • data: "\n\t"
                  }
                ]
              }
            • Text {...}
              • start: 472
              • end: 473
              • type: "Text"
              • raw: "\n"
              • data: "\n"
              }
            ]
          }
        • Text {...}
          • start: 479
          • end: 481
          • type: "Text"
          • raw: "\n\n"
          • data: "\n\n"
          }
        • IfBlock {...}
          • start: 481
          • end: 603
          • type: "IfBlock"
          • expression: BinaryExpression {...}
            • type: "BinaryExpression"
            • start: 486
            • end: 508
            • loc: {...}
              • start: {...}
                • line: 22
                • column: 5
                }
              • end: {...}
                • line: 22
                • column: 27
                }
              }
            • left: MemberExpression {...}
              • type: "MemberExpression"
              • start: 22
              • end: 64
              • object: Identifier {...}
                • type: "Identifier"
                • start: 22
                • end: 45
                • name: "#ctx"
                • loc: {...}
                  • start: {...}
                    • line: 22
                    • column: 5
                    }
                  • end: {...}
                    • line: 22
                    • column: 10
                    }
                  }
                }
              • property: Literal {...}
                • type: "Literal"
                • value: 0
                }
              • computed: true
              • optional: false
              • leadingComments: [...] (1)
                • Block {...}
                  • type: "Block"
                  • value: "$hash"
                  • start: 0
                  • end: 21
                  • has_trailing_newline: false
                  }
                ]
              }
            • operator: "==="
            • right: Literal {...}
              • type: "Literal"
              • start: 496
              • end: 508
              • loc: {...}
                • start: {...}
                  • line: 22
                  • column: 15
                  }
                • end: {...}
                  • line: 22
                  • column: 27
                  }
                }
              • value: "#/articles"
              • raw: "'#/articles'"
              }
            }
          • children: [...] (1)
            • Element {...}
              • start: 511
              • end: 526
              • type: "Element"
              • name: "p"
              • attributes: []
              • children: [...] (1)
                • Text {...}
                  • start: 514
                  • end: 522
                  • type: "Text"
                  • raw: "Articles"
                  • data: "Articles"
                  }
                ]
              }
            ]
          • else: ElseBlock {...}
            • start: 556
            • end: 598
            • type: "ElseBlock"
            • children: [...] (1)
              • IfBlock {...}
                • start: 556
                • end: 603
                • type: "IfBlock"
                • elseif: true
                • expression: BinaryExpression {...}
                  • type: "BinaryExpression"
                  • start: 537
                  • end: 555
                  • loc: {...}
                    • start: {...}
                      • line: 24
                      • column: 10
                      }
                    • end: {...}
                      • line: 24
                      • column: 28
                      }
                    }
                  • left: MemberExpression {...}
                    • type: "MemberExpression"
                    • start: 22
                    • end: 64
                    • object: Identifier {...}
                      • type: "Identifier"
                      • start: 22
                      • end: 45
                      • name: "#ctx"
                      • loc: {...}
                        • start: {...}
                          • line: 24
                          • column: 10
                          }
                        • end: {...}
                          • line: 24
                          • column: 15
                          }
                        }
                      }
                    • property: Literal {...}
                      • type: "Literal"
                      • value: 0
                      }
                    • computed: true
                    • optional: false
                    • leadingComments: [...] (1)
                      • Block {...}
                        • type: "Block"
                        • value: "$hash"
                        • start: 0
                        • end: 21
                        • has_trailing_newline: false
                        }
                      ]
                    }
                  • operator: "==="
                  • right: Literal {...}
                    • type: "Literal"
                    • start: 547
                    • end: 555
                    • loc: {...}
                      • start: {...}
                        • line: 24
                        • column: 20
                        }
                      • end: {...}
                        • line: 24
                        • column: 28
                        }
                      }
                    • value: "#/long"
                    • raw: "'#/long'"
                    }
                  }
                • children: [...] (1)
                  • Element {...}
                    • start: 558
                    • end: 576
                    • type: "Element"
                    • name: "p"
                    • attributes: []
                    • children: [...] (1)
                      • Text {...}
                        • start: 561
                        • end: 572
                        • type: "Text"
                        • raw: "Long Indeed"
                        • data: "Long Indeed"
                        }
                      ]
                    }
                  ]
                • else: ElseBlock {...}
                  • start: 584
                  • end: 598
                  • type: "ElseBlock"
                  • children: [...] (1)
                    • Element {...}
                      • start: 586
                      • end: 597
                      • type: "Element"
                      • name: "p"
                      • attributes: []
                      • children: [...] (1)
                        • Text {...}
                          • start: 589
                          • end: 593
                          • type: "Text"
                          • raw: "Home"
                          • data: "Home"
                          }
                        ]
                      }
                    ]
                  }
                }
              ]
            }
          }
        • Text {...}
          • start: 603
          • end: 605
          • type: "Text"
          • raw: "\n\n"
          • data: "\n\n"
          }
        ]
      }
    • css: Style {...}
      • type: "Style"
      • start: 605
      • end: 653
      • attributes: []
      • children: [...] (1)
        • Rule {...}
          • type: "Rule"
          • selector: SelectorList {...}
            • type: "SelectorList"
            • children: [...] (1)
              • Selector {...}
                • type: "Selector"
                • children: [...] (1)
                  • TypeSelector {...}
                    • type: "TypeSelector"
                    • name: "nav"
                    • start: 614
                    • end: 617
                    }
                  ]
                • start: 614
                • end: 617
                }
              ]
            • start: 614
            • end: 617
            }
          • block: Block {...}
            • type: "Block"
            • children: [...] (1)
              • Declaration {...}
                • type: "Declaration"
                • important: false
                • property: "text-align"
                • value: Value {...}
                  • type: "Value"
                  • children: [...] (1)
                    • Identifier {...}
                      • type: "Identifier"
                      • name: "center"
                      • start: 634
                      • end: 640
                      }
                    ]
                  • start: 633
                  • end: 640
                  }
                • start: 622
                • end: 640
                }
              ]
            • start: 618
            • end: 644
            }
          • start: 614
          • end: 644
          }
        ]
      • content: {...}
        • start: 612
        • end: 645
        • styles: "\n\tnav {\n\t\ttext-align: center;\n\t}\n"
        }
      }
    • instance: Script {...}
      • type: "Script"
      • start: 0
      • end: 157
      • context: "default"
      • content: Program {...}
        • type: "Program"
        • start: 8
        • end: 148
        • loc: {...}
          • start: {...}
            • line: 1
            • column: 0
            }
          • end: {...}
            • line: 7
            • column: 0
            }
          }
        • body: [...] (4)
          • ImportDeclaration {...}
            • type: "ImportDeclaration"
            • start: 10
            • end: 48
            • loc: {...}
              • start: {...}
                • line: 2
                • column: 1
                }
              • end: {...}
                • line: 2
                • column: 39
                }
              }
            • specifiers: [...] (1)
              • ImportDefaultSpecifier {...}
                • type: "ImportDefaultSpecifier"
                • start: 17
                • end: 24
                • loc: {...}
                  • start: {...}
                    • line: 2
                    • column: 8
                    }
                  • end: {...}
                    • line: 2
                    • column: 15
                    }
                  }
                • local: Identifier {...}
                  • type: "Identifier"
                  • start: 17
                  • end: 24
                  • loc: {...}
                    • start: {...}
                      • line: 2
                      • column: 8
                      }
                    • end: {...}
                      • line: 2
                      • column: 15
                      }
                    }
                  • name: "NavLink"
                  }
                }
              ]
            • source: Literal {...}
              • type: "Literal"
              • start: 30
              • end: 48
              • loc: {...}
                • start: {...}
                  • line: 2
                  • column: 21
                  }
                • end: {...}
                  • line: 2
                  • column: 39
                  }
                }
              • value: "./NavLink.svelte"
              • raw: "'./NavLink.svelte'"
              }
            }
          • ImportDeclaration {...}
            • type: "ImportDeclaration"
            • start: 50
            • end: 90
            • loc: {...}
              • start: {...}
                • line: 3
                • column: 1
                }
              • end: {...}
                • line: 3
                • column: 41
                }
              }
            • specifiers: [...] (1)
              • ImportDefaultSpecifier {...}
                • type: "ImportDefaultSpecifier"
                • start: 57
                • end: 65
                • loc: {...}
                  • start: {...}
                    • line: 3
                    • column: 8
                    }
                  • end: {...}
                    • line: 3
                    • column: 16
                    }
                  }
                • local: Identifier {...}
                  • type: "Identifier"
                  • start: 57
                  • end: 65
                  • loc: {...}
                    • start: {...}
                      • line: 3
                      • column: 8
                      }
                    • end: {...}
                      • line: 3
                      • column: 16
                      }
                    }
                  • name: "NavLink2"
                  }
                }
              ]
            • source: Literal {...}
              • type: "Literal"
              • start: 71
              • end: 90
              • loc: {...}
                • start: {...}
                  • line: 3
                  • column: 22
                  }
                • end: {...}
                  • line: 3
                  • column: 41
                  }
                }
              • value: "./NavLink2.svelte"
              • raw: "'./NavLink2.svelte'"
              }
            }
          • ImportDeclaration {...}
            • type: "ImportDeclaration"
            • start: 92
            • end: 117
            • loc: {...}
              • start: {...}
                • line: 4
                • column: 1
                }
              • end: {...}
                • line: 4
                • column: 26
                }
              }
            • specifiers: [...] (1)
              • ImportDefaultSpecifier {...}
                • type: "ImportDefaultSpecifier"
                • start: 99
                • end: 103
                • loc: {...}
                  • start: {...}
                    • line: 4
                    • column: 8
                    }
                  • end: {...}
                    • line: 4
                    • column: 12
                    }
                  }
                • local: Identifier {...}
                  • type: "Identifier"
                  • start: 99
                  • end: 103
                  • loc: {...}
                    • start: {...}
                      • line: 4
                      • column: 8
                      }
                    • end: {...}
                      • line: 4
                      • column: 12
                      }
                    }
                  • name: "hash"
                  }
                }
              ]
            • source: Literal {...}
              • type: "Literal"
              • start: 109
              • end: 117
              • loc: {...}
                • start: {...}
                  • line: 4
                  • column: 18
                  }
                • end: {...}
                  • line: 4
                  • column: 26
                  }
                }
              • value: "./hash"
              • raw: "'./hash'"
              }
            }
          • ExpressionStatement {...}
            • type: "ExpressionStatement"
            • start: 120
            • end: 147
            • loc: {...}
              • start: {...}
                • line: 6
                • column: 1
                }
              • end: {...}
                • line: 6
                • column: 28
                }
              }
            • expression: AssignmentExpression {...}
              • type: "AssignmentExpression"
              • start: 120
              • end: 147
              • loc: {...}
                • start: {...}
                  • line: 6
                  • column: 1
                  }
                • end: {...}
                  • line: 6
                  • column: 28
                  }
                }
              • operator: "="
              • left: MemberExpression {...}
                • type: "MemberExpression"
                • start: 120
                • end: 140
                • loc: {...}
                  • start: {...}
                    • line: 6
                    • column: 1
                    }
                  • end: {...}
                    • line: 6
                    • column: 21
                    }
                  }
                • object: MemberExpression {...}
                  • type: "MemberExpression"
                  • start: 120
                  • end: 135
                  • loc: {...}
                    • start: {...}
                      • line: 6
                      • column: 1
                      }
                    • end: {...}
                      • line: 6
                      • column: 16
                      }
                    }
                  • object: Identifier {...}
                    • type: "Identifier"
                    • start: 120
                    • end: 126
                    • loc: {...}
                      • start: {...}
                        • line: 6
                        • column: 1
                        }
                      • end: {...}
                        • line: 6
                        • column: 7
                        }
                      }
                    • name: "window"
                    }
                  • property: Identifier {...}
                    • type: "Identifier"
                    • start: 127
                    • end: 135
                    • loc: {...}
                      • start: {...}
                        • line: 6
                        • column: 8
                        }
                      • end: {...}
                        • line: 6
                        • column: 16
                        }
                      }
                    • name: "location"
                    }
                  • computed: false
                  • optional: false
                  }
                • property: Identifier {...}
                  • type: "Identifier"
                  • start: 136
                  • end: 140
                  • loc: {...}
                    • start: {...}
                      • line: 6
                      • column: 17
                      }
                    • end: {...}
                      • line: 6
                      • column: 21
                      }
                    }
                  • name: "hash"
                  }
                • computed: false
                • optional: false
                }
              • right: Literal {...}
                • type: "Literal"
                • start: 143
                • end: 147
                • loc: {...}
                  • start: {...}
                    • line: 6
                    • column: 24
                    }
                  • end: {...}
                    • line: 6
                    • column: 28
                    }
                  }
                • value: "#/"
                • raw: "'#/'"
                }
              }
            }
          ]
        • sourceType: "module"
        }
      }
    • module: undefined
    }
The AST is not public API and may change at any point in time