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
Board.svelte
Square.svelte
stores.js
<script>
import Board from './Board.svelte';
import { store, calculateWinner } from './stores.js';

let status;
let winner;

store.subscribe(store => {
winner = calculateWinner(store.history[store.history.length - 1].board);
if (winner) {
status = `Winner: ${winner}`;
} else {
status = `Next player: ${store.xIsNext ? 'X' : 'O'}`;
}
});
</script>

<style>
ol {
padding-left: 30px;
}

.game {
font: 14px "Century Gothic", Futura, sans-serif;
margin: 20px;
display: flex;
flex-direction: row;
}

.game-info {
margin-left: 20px;
}
</style>

<div class='game'>
<div class='game-board'>
import 'svelte/internal/disclose-version';
import 'svelte/internal/flags/legacy';
import * as $ from 'svelte/internal/client';
import Board from './Board.svelte';
import { store, calculateWinner } from './stores.js';

var root_2 = $.template(`<button></button>`);
var root_3 = $.template(`<button>Go to game start</button>`);
var root_1 = $.template(`<li><!></li>`);
var root = $.template(`<div class="game svelte-1ex9nfb"><div class="game-board"><!></div> <div class="game-info svelte-1ex9nfb"><div> </div> <ol class="svelte-1ex9nfb"><!> <ol class="svelte-1ex9nfb"></ol> <div></div></ol></div></div>`);

export default function App($$anchor, $$props) {
$.push($$props, false);

const [$$stores, $$cleanup] = $.setup_stores();
const $store = () => $.store_get(store, '$store', $$stores);
let status = $.mutable_state();
let winner;

store.subscribe((store) => {
winner = calculateWinner(store.history[store.history.length - 1].board);

if (winner) {
$.set(status, `Winner: ${winner}`);
} else {
$.set(status, `Next player: ${store.xIsNext ? 'X' : 'O'}`);
}
});

$.init();

var div = root();
var div_1 = $.child(div);
var node = $.child(div_1);

Board(node, {});
result = svelte.compile(source, {
generate: ,
});

ol.svelte-1ex9nfb {
padding-left: 30px;
}

.game.svelte-1ex9nfb {
font: 14px "Century Gothic", Futura, sans-serif;
margin: 20px;
display: flex;
flex-direction: row;
}

.game-info.svelte-1ex9nfb {
margin-left: 20px;
}

		
			
				
  • Root {
    • css: StyleSheet {...}
      • type: "StyleSheet"
      • start: 389
      • end: 609
      • attributes: []
      • children: [...] (3)
        • Rule {...}
          • type: "Rule"
          • prelude: SelectorList {...}
            • type: "SelectorList"
            • start: 399
            • end: 401
            • children: [...] (1)
              • ComplexSelector {...}
                • type: "ComplexSelector"
                • start: 399
                • end: 401
                • children: [...] (1)
                  • RelativeSelector {...}
                    • type: "RelativeSelector"
                    • combinator: null
                    • selectors: [...] (1)
                      • TypeSelector {...}
                        • type: "TypeSelector"
                        • name: "ol"
                        • start: 399
                        • end: 401
                        }
                      ]
                    • start: 399
                    • end: 401
                    }
                  ]
                }
              ]
            }
          • block: Block {...}
            • type: "Block"
            • start: 402
            • end: 431
            • children: [...] (1)
              • Declaration {...}
                • type: "Declaration"
                • start: 408
                • end: 426
                • property: "padding-left"
                • value: "30px"
                }
              ]
            }
          • start: 399
          • end: 431
          }
        • Rule {...}
          • type: "Rule"
          • prelude: SelectorList {...}
            • type: "SelectorList"
            • start: 435
            • end: 440
            • children: [...] (1)
              • ComplexSelector {...}
                • type: "ComplexSelector"
                • start: 435
                • end: 440
                • children: [...] (1)
                  • RelativeSelector {...}
                    • type: "RelativeSelector"
                    • combinator: null
                    • selectors: [...] (1)
                      • ClassSelector {...}
                        • type: "ClassSelector"
                        • name: "game"
                        • start: 435
                        • end: 440
                        }
                      ]
                    • start: 435
                    • end: 440
                    }
                  ]
                }
              ]
            }
          • block: Block {...}
            • type: "Block"
            • start: 441
            • end: 557
            • children: [...] (4)
              • Declaration {...}
                • type: "Declaration"
                • start: 445
                • end: 492
                • property: "font"
                • value: "14px \"Century Gothic\", Futura, sans-serif"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 496
                • end: 508
                • property: "margin"
                • value: "20px"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 514
                • end: 527
                • property: "display"
                • value: "flex"
                }
              • Declaration {...}
                • type: "Declaration"
                • start: 533
                • end: 552
                • property: "flex-direction"
                • value: "row"
                }
              ]
            }
          • start: 435
          • end: 557
          }
        • Rule {...}
          • type: "Rule"
          • prelude: SelectorList {...}
            • type: "SelectorList"
            • start: 561
            • end: 571
            • children: [...] (1)
              • ComplexSelector {...}
                • type: "ComplexSelector"
                • start: 561
                • end: 571
                • children: [...] (1)
                  • RelativeSelector {...}
                    • type: "RelativeSelector"
                    • combinator: null
                    • selectors: [...] (1)
                      • ClassSelector {...}
                        • type: "ClassSelector"
                        • name: "game-info"
                        • start: 561
                        • end: 571
                        }
                      ]
                    • start: 561
                    • end: 571
                    }
                  ]
                }
              ]
            }
          • block: Block {...}
            • type: "Block"
            • start: 572
            • end: 600
            • children: [...] (1)
              • Declaration {...}
                • type: "Declaration"
                • start: 578
                • end: 595
                • property: "margin-left"
                • value: "20px"
                }
              ]
            }
          • start: 561
          • end: 600
          }
        ]
      • content: {...}
        • start: 396
        • end: 601
        • styles: "\n ol {\n padding-left: 30px;\n }\n\n .game {\n\t\tfont: 14px \"Century Gothic\", Futura, sans-serif;\n\t\tmargin: 20px;\n display: flex;\n flex-direction: row;\n }\n\n .game-info {\n margin-left: 20px;\n }\n"
        • comment: null
        }
      }
    • js: []
    • start: 389
    • end: 1073
    • type: "Root"
    • fragment: Fragment {...}
      • type: "Fragment"
      • nodes: [...] (3)
        • Text {...}
          • type: "Text"
          • start: 387
          • end: 389
          • raw: "\n\n"
          • data: "\n\n"
          }
        • Text {...}
          • type: "Text"
          • start: 609
          • end: 611
          • raw: "\n\n"
          • data: "\n\n"
          }
        • RegularElement {...}
          • type: "RegularElement"
          • start: 611
          • end: 1073
          • name: "div"
          • attributes: [...] (1)
            • Attribute {...}
              • type: "Attribute"
              • start: 616
              • end: 628
              • name: "class"
              • value: [...] (1)
                • Text {...}
                  • start: 623
                  • end: 627
                  • type: "Text"
                  • raw: "game"
                  • data: "game"
                  }
                ]
              }
            ]
          • fragment: Fragment {...}
            • type: "Fragment"
            • nodes: [...] (5)
              • Text {...}
                • type: "Text"
                • start: 629
                • end: 632
                • raw: "\n "
                • data: "\n "
                }
              • RegularElement {...}
                • type: "RegularElement"
                • start: 632
                • end: 679
                • name: "div"
                • attributes: [...] (1)
                  • Attribute {...}
                    • type: "Attribute"
                    • start: 637
                    • end: 655
                    • name: "class"
                    • value: [...] (1)
                      • Text {...}
                        • start: 644
                        • end: 654
                        • type: "Text"
                        • raw: "game-board"
                        • data: "game-board"
                        }
                      ]
                    }
                  ]
                • fragment: Fragment {...}
                  • type: "Fragment"
                  • nodes: [...] (3)
                    • Text {...}
                      • type: "Text"
                      • start: 656
                      • end: 661
                      • raw: "\n "
                      • data: "\n "
                      }
                    • Component {...}
                      • type: "Component"
                      • start: 661
                      • end: 670
                      • name: "Board"
                      • attributes: []
                      • fragment: Fragment {...}
                        • type: "Fragment"
                        • nodes: []
                        }
                      }
                    • Text {...}
                      • type: "Text"
                      • start: 670
                      • end: 673
                      • raw: "\n "
                      • data: "\n "
                      }
                    ]
                  }
                }
              • Text {...}
                • type: "Text"
                • start: 679
                • end: 682
                • raw: " "
                • data: " "
                }
              • RegularElement {...}
                • type: "RegularElement"
                • start: 682
                • end: 1066
                • name: "div"
                • attributes: [...] (1)
                  • Attribute {...}
                    • type: "Attribute"
                    • start: 687
                    • end: 704
                    • name: "class"
                    • value: [...] (1)
                      • Text {...}
                        • start: 694
                        • end: 703
                        • type: "Text"
                        • raw: "game-info"
                        • data: "game-info"
                        }
                      ]
                    }
                  ]
                • fragment: Fragment {...}
                  • type: "Fragment"
                  • nodes: [...] (4)
                    • Text {...}
                      • type: "Text"
                      • start: 705
                      • end: 710
                      • raw: "\n "
                      • data: "\n "
                      }
                    • RegularElement {...}
                      • type: "RegularElement"
                      • start: 710
                      • end: 729
                      • name: "div"
                      • attributes: []
                      • fragment: Fragment {...}
                        • type: "Fragment"
                        • nodes: [...] (1)
                          • ExpressionTag {...}
                            • type: "ExpressionTag"
                            • start: 715
                            • end: 723
                            • expression: Identifier {...}
                              • type: "Identifier"
                              • start: 716
                              • end: 722
                              • loc: {...}
                                • start: {...}
                                  • line: 40
                                  • column: 10
                                  }
                                • end: {...}
                                  • line: 40
                                  • column: 16
                                  }
                                }
                              • name: "status"
                              }
                            }
                          ]
                        }
                      }
                    • Text {...}
                      • type: "Text"
                      • start: 729
                      • end: 736
                      • raw: " "
                      • data: " "
                      }
                    • RegularElement {...}
                      • type: "RegularElement"
                      • start: 736
                      • end: 1060
                      • name: "ol"
                      • attributes: [...] (1)
                        • Attribute {...}
                          • type: "Attribute"
                          • start: -1
                          • end: -1
                          • name: "class"
                          • value: [...] (1)
                            • Text {...}
                              • type: "Text"
                              • data: ""
                              • raw: ""
                              • start: -1
                              • end: -1
                              }
                            ]
                          }
                        ]
                      • fragment: Fragment {...}
                        • type: "Fragment"
                        • nodes: [...] (7)
                          • Text {...}
                            • type: "Text"
                            • start: 740
                            • end: 749
                            • raw: "\n "
                            • data: "\n "
                            }
                          • EachBlock {...}
                            • type: "EachBlock"
                            • start: 749
                            • end: 1032
                            • expression: MemberExpression {...}
                              • type: "MemberExpression"
                              • start: 756
                              • end: 770
                              • loc: {...}
                                • start: {...}
                                  • line: 42
                                  • column: 15
                                  }
                                • end: {...}
                                  • line: 42
                                  • column: 29
                                  }
                                }
                              • object: Identifier {...}
                                • type: "Identifier"
                                • start: 756
                                • end: 762
                                • loc: {...}
                                  • start: {...}
                                    • line: 42
                                    • column: 15
                                    }
                                  • end: {...}
                                    • line: 42
                                    • column: 21
                                    }
                                  }
                                • name: "$store"
                                }
                              • property: Identifier {...}
                                • type: "Identifier"
                                • start: 763
                                • end: 770
                                • loc: {...}
                                  • start: {...}
                                    • line: 42
                                    • column: 22
                                    }
                                  • end: {...}
                                    • line: 42
                                    • column: 29
                                    }
                                  }
                                • name: "history"
                                }
                              • computed: false
                              • optional: false
                              }
                            • body: Fragment {...}
                              • type: "Fragment"
                              • nodes: [...] (3)
                                • Text {...}
                                  • type: "Text"
                                  • start: 785
                                  • end: 796
                                  • raw: "\n "
                                  • data: "\n "
                                  }
                                • RegularElement {...}
                                  • type: "RegularElement"
                                  • start: 796
                                  • end: 1016
                                  • name: "li"
                                  • attributes: [...] (1)
                                    • OnDirective {...}
                                      • start: 800
                                      • end: 837
                                      • type: "OnDirective"
                                      • name: "click"
                                      • expression: ArrowFunctionExpression {...}
                                        • type: "ArrowFunctionExpression"
                                        • start: 811
                                        • end: 835
                                        • loc: {...}
                                          • start: {...}
                                            • line: 43
                                            • column: 25
                                            }
                                          • end: {...}
                                            • line: 43
                                            • column: 49
                                            }
                                          }
                                        • id: null
                                        • expression: true
                                        • generator: false
                                        • async: false
                                        • params: []
                                        • body: CallExpression {...}
                                          • type: "CallExpression"
                                          • start: 817
                                          • end: 835
                                          • loc: {...}
                                            • start: {...}
                                              • line: 43
                                              • column: 31
                                              }
                                            • end: {...}
                                              • line: 43
                                              • column: 49
                                              }
                                            }
                                          • callee: MemberExpression {...}
                                            • type: "MemberExpression"
                                            • start: 817
                                            • end: 829
                                            • loc: {...}
                                              • start: {...}
                                                • line: 43
                                                • column: 31
                                                }
                                              • end: {...}
                                                • line: 43
                                                • column: 43
                                                }
                                              }
                                            • object: Identifier {...}
                                              • type: "Identifier"
                                              • start: 817
                                              • end: 822
                                              • loc: {...}
                                                • start: {...}
                                                  • line: 43
                                                  • column: 31
                                                  }
                                                • end: {...}
                                                  • line: 43
                                                  • column: 36
                                                  }
                                                }
                                              • name: "store"
                                              }
                                            • property: Identifier {...}
                                              • type: "Identifier"
                                              • start: 823
                                              • end: 829
                                              • loc: {...}
                                                • start: {...}
                                                  • line: 43
                                                  • column: 37
                                                  }
                                                • end: {...}
                                                  • line: 43
                                                  • column: 43
                                                  }
                                                }
                                              • name: "jumpTo"
                                              }
                                            • computed: false
                                            • optional: false
                                            }
                                          • arguments: [...] (1)
                                            • Identifier {...}
                                              • type: "Identifier"
                                              • start: 830
                                              • end: 834
                                              • loc: {...}
                                                • start: {...}
                                                  • line: 43
                                                  • column: 44
                                                  }
                                                • end: {...}
                                                  • line: 43
                                                  • column: 48
                                                  }
                                                }
                                              • name: "move"
                                              }
                                            ]
                                          • optional: false
                                          }
                                        }
                                      • modifiers: []
                                      }
                                    ]
                                  • fragment: Fragment {...}
                                    • type: "Fragment"
                                    • nodes: [...] (3)
                                      • Text {...}
                                        • type: "Text"
                                        • start: 838
                                        • end: 851
                                        • raw: "\n "
                                        • data: "\n "
                                        }
                                      • IfBlock {...}
                                        • type: "IfBlock"
                                        • elseif: false
                                        • start: 851
                                        • end: 1000
                                        • test: Identifier {...}
                                          • type: "Identifier"
                                          • start: 856
                                          • end: 860
                                          • loc: {...}
                                            • start: {...}
                                              • line: 44
                                              • column: 17
                                              }
                                            • end: {...}
                                              • line: 44
                                              • column: 21
                                              }
                                            }
                                          • name: "move"
                                          }
                                        • consequent: Fragment {...}
                                          • type: "Fragment"
                                          • nodes: [...] (3)
                                            • Text {...}
                                              • type: "Text"
                                              • start: 861
                                              • end: 876
                                              • raw: "\n "
                                              • data: "\n "
                                              }
                                            • RegularElement {...}
                                              • type: "RegularElement"
                                              • start: 876
                                              • end: 914
                                              • name: "button"
                                              • attributes: []
                                              • fragment: Fragment {...}
                                                • type: "Fragment"
                                                • nodes: [...] (2)
                                                  • Text {...}
                                                    • type: "Text"
                                                    • start: 884
                                                    • end: 897
                                                    • raw: "Go to move # "
                                                    • data: "Go to move # "
                                                    }
                                                  • ExpressionTag {...}
                                                    • type: "ExpressionTag"
                                                    • start: 897
                                                    • end: 905
                                                    • expression: Identifier {...}
                                                      • type: "Identifier"
                                                      • start: 899
                                                      • end: 903
                                                      • loc: {...}
                                                        • start: {...}
                                                          • line: 45
                                                          • column: 37
                                                          }
                                                        • end: {...}
                                                          • line: 45
                                                          • column: 41
                                                          }
                                                        }
                                                      • name: "move"
                                                      }
                                                    }
                                                  ]
                                                }
                                              }
                                            • Text {...}
                                              • type: "Text"
                                              • start: 914
                                              • end: 927
                                              • raw: "\n "
                                              • data: "\n "
                                              }
                                            ]
                                          }
                                        • alternate: Fragment {...}
                                          • type: "Fragment"
                                          • nodes: [...] (3)
                                            • Text {...}
                                              • type: "Text"
                                              • start: 934
                                              • end: 949
                                              • raw: "\n "
                                              • data: "\n "
                                              }
                                            • RegularElement {...}
                                              • type: "RegularElement"
                                              • start: 949
                                              • end: 982
                                              • name: "button"
                                              • attributes: []
                                              • fragment: Fragment {...}
                                                • type: "Fragment"
                                                • nodes: [...] (1)
                                                  • Text {...}
                                                    • type: "Text"
                                                    • start: 957
                                                    • end: 973
                                                    • raw: "Go to game start"
                                                    • data: "Go to game start"
                                                    }
                                                  ]
                                                }
                                              }
                                            • Text {...}
                                              • type: "Text"
                                              • start: 982
                                              • end: 995
                                              • raw: "\n "
                                              • data: "\n "
                                              }
                                            ]
                                          }
                                        }
                                      • Text {...}
                                        • type: "Text"
                                        • start: 1000
                                        • end: 1011
                                        • raw: "\n "
                                        • data: "\n "
                                        }
                                      ]
                                    }
                                  }
                                • Text {...}
                                  • type: "Text"
                                  • start: 1016
                                  • end: 1025
                                  • raw: "\n "
                                  • data: "\n "
                                  }
                                ]
                              }
                            • context: Identifier {...}
                              • type: "Identifier"
                              • name: "step"
                              • start: 774
                              • loc: {...}
                                • start: {...}
                                  • line: 42
                                  • column: 33
                                  • character: 774
                                  }
                                • end: {...}
                                  • line: 42
                                  • column: 37
                                  • character: 778
                                  }
                                }
                              • end: 778
                              • typeAnnotation: undefined
                              }
                            • index: "move"
                            • key: undefined
                            }
                          • Text {...}
                            • type: "Text"
                            • start: 1032
                            • end: 1039
                            • raw: " "
                            • data: " "
                            }
                          • RegularElement {...}
                            • type: "RegularElement"
                            • start: 1039
                            • end: 1045
                            • name: "ol"
                            • attributes: [...] (1)
                              • Attribute {...}
                                • type: "Attribute"
                                • start: -1
                                • end: -1
                                • name: "class"
                                • value: [...] (1)
                                  • Text {...}
                                    • type: "Text"
                                    • data: ""
                                    • raw: ""
                                    • start: -1
                                    • end: -1
                                    }
                                  ]
                                }
                              ]
                            • fragment: Fragment {...}
                              • type: "Fragment"
                              • nodes: []
                              }
                            }
                          • Text {...}
                            • type: "Text"
                            • start: 1045
                            • end: 1050
                            • raw: " "
                            • data: " "
                            }
                          • RegularElement {...}
                            • type: "RegularElement"
                            • start: 1050
                            • end: 1057
                            • name: "div"
                            • attributes: []
                            • fragment: Fragment {...}
                              • type: "Fragment"
                              • nodes: []
                              }
                            }
                          • Text {...}
                            • type: "Text"
                            • start: 1057
                            • end: 1060
                            • raw: "\n "
                            • data: "\n "
                            }
                          ]
                        }
                      }
                    ]
                  }
                }
              • Text {...}
                • type: "Text"
                • start: 1066
                • end: 1067
                • raw: "\n"
                • data: "\n"
                }
              ]
            }
          }
        ]
      }
    • options: null
    • instance: Script {...}
      • type: "Script"
      • start: 0
      • end: 387
      • context: "default"
      • content: Program {...}
        • type: "Program"
        • start: 8
        • end: 378
        • loc: {...}
          • start: {...}
            • line: 1
            • column: 0
            }
          • end: {...}
            • line: 16
            • column: 0
            }
          }
        • body: [...] (5)
          • ImportDeclaration {...}
            • type: "ImportDeclaration"
            • start: 11
            • end: 46
            • loc: {...}
              • start: {...}
                • line: 2
                • column: 2
                }
              • end: {...}
                • line: 2
                • column: 37
                }
              }
            • specifiers: [...] (1)
              • ImportDefaultSpecifier {...}
                • type: "ImportDefaultSpecifier"
                • start: 18
                • end: 23
                • loc: {...}
                  • start: {...}
                    • line: 2
                    • column: 9
                    }
                  • end: {...}
                    • line: 2
                    • column: 14
                    }
                  }
                • local: Identifier {...}
                  • type: "Identifier"
                  • start: 18
                  • end: 23
                  • loc: {...}
                    • start: {...}
                      • line: 2
                      • column: 9
                      }
                    • end: {...}
                      • line: 2
                      • column: 14
                      }
                    }
                  • name: "Board"
                  }
                }
              ]
            • source: Literal {...}
              • type: "Literal"
              • start: 29
              • end: 45
              • loc: {...}
                • start: {...}
                  • line: 2
                  • column: 20
                  }
                • end: {...}
                  • line: 2
                  • column: 36
                  }
                }
              • value: "./Board.svelte"
              • raw: "'./Board.svelte'"
              }
            }
          • ImportDeclaration {...}
            • type: "ImportDeclaration"
            • start: 49
            • end: 102
            • loc: {...}
              • start: {...}
                • line: 3
                • column: 2
                }
              • end: {...}
                • line: 3
                • column: 55
                }
              }
            • specifiers: [...] (2)
              • ImportSpecifier {...}
                • type: "ImportSpecifier"
                • start: 58
                • end: 63
                • loc: {...}
                  • start: {...}
                    • line: 3
                    • column: 11
                    }
                  • end: {...}
                    • line: 3
                    • column: 16
                    }
                  }
                • imported: Identifier {...}
                  • type: "Identifier"
                  • start: 58
                  • end: 63
                  • loc: {...}
                    • start: {...}
                      • line: 3
                      • column: 11
                      }
                    • end: {...}
                      • line: 3
                      • column: 16
                      }
                    }
                  • name: "store"
                  }
                • local: Identifier {...}
                  • type: "Identifier"
                  • start: 58
                  • end: 63
                  • loc: {...}
                    • start: {...}
                      • line: 3
                      • column: 11
                      }
                    • end: {...}
                      • line: 3
                      • column: 16
                      }
                    }
                  • name: "store"
                  }
                }
              • ImportSpecifier {...}
                • type: "ImportSpecifier"
                • start: 65
                • end: 80
                • loc: {...}
                  • start: {...}
                    • line: 3
                    • column: 18
                    }
                  • end: {...}
                    • line: 3
                    • column: 33
                    }
                  }
                • imported: Identifier {...}
                  • type: "Identifier"
                  • start: 65
                  • end: 80
                  • loc: {...}
                    • start: {...}
                      • line: 3
                      • column: 18
                      }
                    • end: {...}
                      • line: 3
                      • column: 33
                      }
                    }
                  • name: "calculateWinner"
                  }
                • local: Identifier {...}
                  • type: "Identifier"
                  • start: 65
                  • end: 80
                  • loc: {...}
                    • start: {...}
                      • line: 3
                      • column: 18
                      }
                    • end: {...}
                      • line: 3
                      • column: 33
                      }
                    }
                  • name: "calculateWinner"
                  }
                }
              ]
            • source: Literal {...}
              • type: "Literal"
              • start: 88
              • end: 101
              • loc: {...}
                • start: {...}
                  • line: 3
                  • column: 41
                  }
                • end: {...}
                  • line: 3
                  • column: 54
                  }
                }
              • value: "./stores.js"
              • raw: "'./stores.js'"
              }
            }
          • VariableDeclaration {...}
            • type: "VariableDeclaration"
            • start: 106
            • end: 117
            • loc: {...}
              • start: {...}
                • line: 5
                • column: 2
                }
              • end: {...}
                • line: 5
                • column: 13
                }
              }
            • declarations: [...] (1)
              • VariableDeclarator {...}
                • type: "VariableDeclarator"
                • start: 110
                • end: 116
                • loc: {...}
                  • start: {...}
                    • line: 5
                    • column: 6
                    }
                  • end: {...}
                    • line: 5
                    • column: 12
                    }
                  }
                • id: Identifier {...}
                  • type: "Identifier"
                  • start: 110
                  • end: 116
                  • loc: {...}
                    • start: {...}
                      • line: 5
                      • column: 6
                      }
                    • end: {...}
                      • line: 5
                      • column: 12
                      }
                    }
                  • name: "status"
                  }
                • init: null
                }
              ]
            • kind: "let"
            }
          • VariableDeclaration {...}
            • type: "VariableDeclaration"
            • start: 120
            • end: 131
            • loc: {...}
              • start: {...}
                • line: 6
                • column: 2
                }
              • end: {...}
                • line: 6
                • column: 13
                }
              }
            • declarations: [...] (1)
              • VariableDeclarator {...}
                • type: "VariableDeclarator"
                • start: 124
                • end: 130
                • loc: {...}
                  • start: {...}
                    • line: 6
                    • column: 6
                    }
                  • end: {...}
                    • line: 6
                    • column: 12
                    }
                  }
                • id: Identifier {...}
                  • type: "Identifier"
                  • start: 124
                  • end: 130
                  • loc: {...}
                    • start: {...}
                      • line: 6
                      • column: 6
                      }
                    • end: {...}
                      • line: 6
                      • column: 12
                      }
                    }
                  • name: "winner"
                  }
                • init: null
                }
              ]
            • kind: "let"
            }
          • ExpressionStatement {...}
            • type: "ExpressionStatement"
            • start: 135
            • end: 377
            • loc: {...}
              • start: {...}
                • line: 8
                • column: 2
                }
              • end: {...}
                • line: 15
                • column: 5
                }
              }
            • expression: CallExpression {...}
              • type: "CallExpression"
              • start: 135
              • end: 376
              • loc: {...}
                • start: {...}
                  • line: 8
                  • column: 2
                  }
                • end: {...}
                  • line: 15
                  • column: 4
                  }
                }
              • callee: MemberExpression {...}
                • type: "MemberExpression"
                • start: 135
                • end: 150
                • loc: {...}
                  • start: {...}
                    • line: 8
                    • column: 2
                    }
                  • end: {...}
                    • line: 8
                    • column: 17
                    }
                  }
                • object: Identifier {...}
                  • type: "Identifier"
                  • start: 135
                  • end: 140
                  • loc: {...}
                    • start: {...}
                      • line: 8
                      • column: 2
                      }
                    • end: {...}
                      • line: 8
                      • column: 7
                      }
                    }
                  • name: "store"
                  }
                • property: Identifier {...}
                  • type: "Identifier"
                  • start: 141
                  • end: 150
                  • loc: {...}
                    • start: {...}
                      • line: 8
                      • column: 8
                      }
                    • end: {...}
                      • line: 8
                      • column: 17
                      }
                    }
                  • name: "subscribe"
                  }
                • computed: false
                • optional: false
                }
              • arguments: [...] (1)
                • ArrowFunctionExpression {...}
                  • type: "ArrowFunctionExpression"
                  • start: 151
                  • end: 375
                  • loc: {...}
                    • start: {...}
                      • line: 8
                      • column: 18
                      }
                    • end: {...}
                      • line: 15
                      • column: 3
                      }
                    }
                  • id: null
                  • expression: false
                  • generator: false
                  • async: false
                  • params: [...] (1)
                    • Identifier {...}
                      • type: "Identifier"
                      • start: 151
                      • end: 156
                      • loc: {...}
                        • start: {...}
                          • line: 8
                          • column: 18
                          }
                        • end: {...}
                          • line: 8
                          • column: 23
                          }
                        }
                      • name: "store"
                      }
                    ]
                  • body: BlockStatement {...}
                    • type: "BlockStatement"
                    • start: 160
                    • end: 375
                    • loc: {...}
                      • start: {...}
                        • line: 8
                        • column: 27
                        }
                      • end: {...}
                        • line: 15
                        • column: 3
                        }
                      }
                    • body: [...] (2)
                      • ExpressionStatement {...}
                        • type: "ExpressionStatement"
                        • start: 166
                        • end: 238
                        • loc: {...}
                          • start: {...}
                            • line: 9
                            • column: 4
                            }
                          • end: {...}
                            • line: 9
                            • column: 76
                            }
                          }
                        • expression: AssignmentExpression {...}
                          • type: "AssignmentExpression"
                          • start: 166
                          • end: 237
                          • loc: {...}
                            • start: {...}
                              • line: 9
                              • column: 4
                              }
                            • end: {...}
                              • line: 9
                              • column: 75
                              }
                            }
                          • operator: "="
                          • left: Identifier {...}
                            • type: "Identifier"
                            • start: 166
                            • end: 172
                            • loc: {...}
                              • start: {...}
                                • line: 9
                                • column: 4
                                }
                              • end: {...}
                                • line: 9
                                • column: 10
                                }
                              }
                            • name: "winner"
                            }
                          • right: CallExpression {...}
                            • type: "CallExpression"
                            • start: 175
                            • end: 237
                            • loc: {...}
                              • start: {...}
                                • line: 9
                                • column: 13
                                }
                              • end: {...}
                                • line: 9
                                • column: 75
                                }
                              }
                            • callee: Identifier {...}
                              • type: "Identifier"
                              • start: 175
                              • end: 190
                              • loc: {...}
                                • start: {...}
                                  • line: 9
                                  • column: 13
                                  }
                                • end: {...}
                                  • line: 9
                                  • column: 28
                                  }
                                }
                              • name: "calculateWinner"
                              }
                            • arguments: [...] (1)
                              • MemberExpression {...}
                                • type: "MemberExpression"
                                • start: 191
                                • end: 236
                                • loc: {...}
                                  • start: {...}
                                    • line: 9
                                    • column: 29
                                    }
                                  • end: {...}
                                    • line: 9
                                    • column: 74
                                    }
                                  }
                                • object: MemberExpression {...}
                                  • type: "MemberExpression"
                                  • start: 191
                                  • end: 230
                                  • loc: {...}
                                    • start: {...}
                                      • line: 9
                                      • column: 29
                                      }
                                    • end: {...}
                                      • line: 9
                                      • column: 68
                                      }
                                    }
                                  • object: MemberExpression {...}
                                    • type: "MemberExpression"
                                    • start: 191
                                    • end: 204
                                    • loc: {...}
                                      • start: {...}
                                        • line: 9
                                        • column: 29
                                        }
                                      • end: {...}
                                        • line: 9
                                        • column: 42
                                        }
                                      }
                                    • object: Identifier {...}
                                      • type: "Identifier"
                                      • start: 191
                                      • end: 196
                                      • loc: {...}
                                        • start: {...}
                                          • line: 9
                                          • column: 29
                                          }
                                        • end: {...}
                                          • line: 9
                                          • column: 34
                                          }
                                        }
                                      • name: "store"
                                      }
                                    • property: Identifier {...}
                                      • type: "Identifier"
                                      • start: 197
                                      • end: 204
                                      • loc: {...}
                                        • start: {...}
                                          • line: 9
                                          • column: 35
                                          }
                                        • end: {...}
                                          • line: 9
                                          • column: 42
                                          }
                                        }
                                      • name: "history"
                                      }
                                    • computed: false
                                    • optional: false
                                    }
                                  • property: BinaryExpression {...}
                                    • type: "BinaryExpression"
                                    • start: 205
                                    • end: 229
                                    • loc: {...}
                                      • start: {...}
                                        • line: 9
                                        • column: 43
                                        }
                                      • end: {...}
                                        • line: 9
                                        • column: 67
                                        }
                                      }
                                    • left: MemberExpression {...}
                                      • type: "MemberExpression"
                                      • start: 205
                                      • end: 225
                                      • loc: {...}
                                        • start: {...}
                                          • line: 9
                                          • column: 43
                                          }
                                        • end: {...}
                                          • line: 9
                                          • column: 63
                                          }
                                        }
                                      • object: MemberExpression {...}
                                        • type: "MemberExpression"
                                        • start: 205
                                        • end: 218
                                        • loc: {...}
                                          • start: {...}
                                            • line: 9
                                            • column: 43
                                            }
                                          • end: {...}
                                            • line: 9
                                            • column: 56
                                            }
                                          }
                                        • object: Identifier {...}
                                          • type: "Identifier"
                                          • start: 205
                                          • end: 210
                                          • loc: {...}
                                            • start: {...}
                                              • line: 9
                                              • column: 43
                                              }
                                            • end: {...}
                                              • line: 9
                                              • column: 48
                                              }
                                            }
                                          • name: "store"
                                          }
                                        • property: Identifier {...}
                                          • type: "Identifier"
                                          • start: 211
                                          • end: 218
                                          • loc: {...}
                                            • start: {...}
                                              • line: 9
                                              • column: 49
                                              }
                                            • end: {...}
                                              • line: 9
                                              • column: 56
                                              }
                                            }
                                          • name: "history"
                                          }
                                        • computed: false
                                        • optional: false
                                        }
                                      • property: Identifier {...}
                                        • type: "Identifier"
                                        • start: 219
                                        • end: 225
                                        • loc: {...}
                                          • start: {...}
                                            • line: 9
                                            • column: 57
                                            }
                                          • end: {...}
                                            • line: 9
                                            • column: 63
                                            }
                                          }
                                        • name: "length"
                                        }
                                      • computed: false
                                      • optional: false
                                      }
                                    • operator: "-"
                                    • right: Literal {...}
                                      • type: "Literal"
                                      • start: 228
                                      • end: 229
                                      • loc: {...}
                                        • start: {...}
                                          • line: 9
                                          • column: 66
                                          }
                                        • end: {...}
                                          • line: 9
                                          • column: 67
                                          }
                                        }
                                      • value: 1
                                      • raw: "1"
                                      }
                                    }
                                  • computed: true
                                  • optional: false
                                  }
                                • property: Identifier {...}
                                  • type: "Identifier"
                                  • start: 231
                                  • end: 236
                                  • loc: {...}
                                    • start: {...}
                                      • line: 9
                                      • column: 69
                                      }
                                    • end: {...}
                                      • line: 9
                                      • column: 74
                                      }
                                    }
                                  • name: "board"
                                  }
                                • computed: false
                                • optional: false
                                }
                              ]
                            • optional: false
                            }
                          }
                        }
                      • IfStatement {...}
                        • type: "IfStatement"
                        • start: 243
                        • end: 371
                        • loc: {...}
                          • start: {...}
                            • line: 10
                            • column: 4
                            }
                          • end: {...}
                            • line: 14
                            • column: 5
                            }
                          }
                        • test: Identifier {...}
                          • type: "Identifier"
                          • start: 247
                          • end: 253
                          • loc: {...}
                            • start: {...}
                              • line: 10
                              • column: 8
                              }
                            • end: {...}
                              • line: 10
                              • column: 14
                              }
                            }
                          • name: "winner"
                          }
                        • consequent: BlockStatement {...}
                          • type: "BlockStatement"
                          • start: 255
                          • end: 298
                          • loc: {...}
                            • start: {...}
                              • line: 10
                              • column: 16
                              }
                            • end: {...}
                              • line: 12
                              • column: 5
                              }
                            }
                          • body: [...] (1)
                            • ExpressionStatement {...}
                              • type: "ExpressionStatement"
                              • start: 263
                              • end: 292
                              • loc: {...}
                                • start: {...}
                                  • line: 11
                                  • column: 6
                                  }
                                • end: {...}
                                  • line: 11
                                  • column: 35
                                  }
                                }
                              • expression: AssignmentExpression {...}
                                • type: "AssignmentExpression"
                                • start: 263
                                • end: 291
                                • loc: {...}
                                  • start: {...}
                                    • line: 11
                                    • column: 6
                                    }
                                  • end: {...}
                                    • line: 11
                                    • column: 34
                                    }
                                  }
                                • operator: "="
                                • left: Identifier {...}
                                  • type: "Identifier"
                                  • start: 263
                                  • end: 269
                                  • loc: {...}
                                    • start: {...}
                                      • line: 11
                                      • column: 6
                                      }
                                    • end: {...}
                                      • line: 11
                                      • column: 12
                                      }
                                    }
                                  • name: "status"
                                  }
                                • right: TemplateLiteral {...}
                                  • type: "TemplateLiteral"
                                  • start: 272
                                  • end: 291
                                  • loc: {...}
                                    • start: {...}
                                      • line: 11
                                      • column: 15
                                      }
                                    • end: {...}
                                      • line: 11
                                      • column: 34
                                      }
                                    }
                                  • expressions: [...] (1)
                                    • Identifier {...}
                                      • type: "Identifier"
                                      • start: 283
                                      • end: 289
                                      • loc: {...}
                                        • start: {...}
                                          • line: 11
                                          • column: 26
                                          }
                                        • end: {...}
                                          • line: 11
                                          • column: 32
                                          }
                                        }
                                      • name: "winner"
                                      }
                                    ]
                                  • quasis: [...] (2)
                                    • TemplateElement {...}
                                      • type: "TemplateElement"
                                      • start: 273
                                      • end: 281
                                      • loc: {...}
                                        • start: {...}
                                          • line: 11
                                          • column: 16
                                          }
                                        • end: {...}
                                          • line: 11
                                          • column: 24
                                          }
                                        }
                                      • value: {...}
                                        • raw: "Winner: "
                                        • cooked: "Winner: "
                                        }
                                      • tail: false
                                      }
                                    • TemplateElement {...}
                                      • type: "TemplateElement"
                                      • start: 290
                                      • end: 290
                                      • loc: {...}
                                        • start: {...}
                                          • line: 11
                                          • column: 33
                                          }
                                        • end: {...}
                                          • line: 11
                                          • column: 33
                                          }
                                        }
                                      • value: {...}
                                        • raw: ""
                                        • cooked: ""
                                        }
                                      • tail: true
                                      }
                                    ]
                                  }
                                }
                              }
                            ]
                          }
                        • alternate: BlockStatement {...}
                          • type: "BlockStatement"
                          • start: 304
                          • end: 371
                          • loc: {...}
                            • start: {...}
                              • line: 12
                              • column: 11
                              }
                            • end: {...}
                              • line: 14
                              • column: 5
                              }
                            }
                          • body: [...] (1)
                            • ExpressionStatement {...}
                              • type: "ExpressionStatement"
                              • start: 312
                              • end: 365
                              • loc: {...}
                                • start: {...}
                                  • line: 13
                                  • column: 6
                                  }
                                • end: {...}
                                  • line: 13
                                  • column: 59
                                  }
                                }
                              • expression: AssignmentExpression {...}
                                • type: "AssignmentExpression"
                                • start: 312
                                • end: 364
                                • loc: {...}
                                  • start: {...}
                                    • line: 13
                                    • column: 6
                                    }
                                  • end: {...}
                                    • line: 13
                                    • column: 58
                                    }
                                  }
                                • operator: "="
                                • left: Identifier {...}
                                  • type: "Identifier"
                                  • start: 312
                                  • end: 318
                                  • loc: {...}
                                    • start: {...}
                                      • line: 13
                                      • column: 6
                                      }
                                    • end: {...}
                                      • line: 13
                                      • column: 12
                                      }
                                    }
                                  • name: "status"
                                  }
                                • right: TemplateLiteral {...}
                                  • type: "TemplateLiteral"
                                  • start: 321
                                  • end: 364
                                  • loc: {...}
                                    • start: {...}
                                      • line: 13
                                      • column: 15
                                      }
                                    • end: {...}
                                      • line: 13
                                      • column: 58
                                      }
                                    }
                                  • expressions: [...] (1)
                                    • ConditionalExpression {...}
                                      • type: "ConditionalExpression"
                                      • start: 337
                                      • end: 362
                                      • loc: {...}
                                        • start: {...}
                                          • line: 13
                                          • column: 31
                                          }
                                        • end: {...}
                                          • line: 13
                                          • column: 56
                                          }
                                        }
                                      • test: MemberExpression {...}
                                        • type: "MemberExpression"
                                        • start: 337
                                        • end: 350
                                        • loc: {...}
                                          • start: {...}
                                            • line: 13
                                            • column: 31
                                            }
                                          • end: {...}
                                            • line: 13
                                            • column: 44
                                            }
                                          }
                                        • object: Identifier {...}
                                          • type: "Identifier"
                                          • start: 337
                                          • end: 342
                                          • loc: {...}
                                            • start: {...}
                                              • line: 13
                                              • column: 31
                                              }
                                            • end: {...}
                                              • line: 13
                                              • column: 36
                                              }
                                            }
                                          • name: "store"
                                          }
                                        • property: Identifier {...}
                                          • type: "Identifier"
                                          • start: 343
                                          • end: 350
                                          • loc: {...}
                                            • start: {...}
                                              • line: 13
                                              • column: 37
                                              }
                                            • end: {...}
                                              • line: 13
                                              • column: 44
                                              }
                                            }
                                          • name: "xIsNext"
                                          }
                                        • computed: false
                                        • optional: false
                                        }
                                      • consequent: Literal {...}
                                        • type: "Literal"
                                        • start: 353
                                        • end: 356
                                        • loc: {...}
                                          • start: {...}
                                            • line: 13
                                            • column: 47
                                            }
                                          • end: {...}
                                            • line: 13
                                            • column: 50
                                            }
                                          }
                                        • value: "X"
                                        • raw: "'X'"
                                        }
                                      • alternate: Literal {...}
                                        • type: "Literal"
                                        • start: 359
                                        • end: 362
                                        • loc: {...}
                                          • start: {...}
                                            • line: 13
                                            • column: 53
                                            }
                                          • end: {...}
                                            • line: 13
                                            • column: 56
                                            }
                                          }
                                        • value: "O"
                                        • raw: "'O'"
                                        }
                                      }
                                    ]
                                  • quasis: [...] (2)
                                    • TemplateElement {...}
                                      • type: "TemplateElement"
                                      • start: 322
                                      • end: 335
                                      • loc: {...}
                                        • start: {...}
                                          • line: 13
                                          • column: 16
                                          }
                                        • end: {...}
                                          • line: 13
                                          • column: 29
                                          }
                                        }
                                      • value: {...}
                                        • raw: "Next player: "
                                        • cooked: "Next player: "
                                        }
                                      • tail: false
                                      }
                                    • TemplateElement {...}
                                      • type: "TemplateElement"
                                      • start: 363
                                      • end: 363
                                      • loc: {...}
                                        • start: {...}
                                          • line: 13
                                          • column: 57
                                          }
                                        • end: {...}
                                          • line: 13
                                          • column: 57
                                          }
                                        }
                                      • value: {...}
                                        • raw: ""
                                        • cooked: ""
                                        }
                                      • tail: true
                                      }
                                    ]
                                  }
                                }
                              }
                            ]
                          }
                        }
                      ]
                    }
                  }
                ]
              • optional: false
              }
            }
          ]
        • sourceType: "module"
        }
      • attributes: []
      }
    }
The AST is not public API and may change at any point in time
Tic Tac Toe • Playground • Svelte