Kde uvidíte chyby

Chyby k programování patří a Vue vám o nich dá vědět na dvou místech.

Chyba v souboru, třeba chybějící zavírací tag, aplikaci vůbec nedovolí běžet. Náhled zůstane prázdný a pod ním se červeně objeví, co je špatně a kde:

App.vue(13,5): Element is missing end tag.

Čísla jsou řádek a sloupec: prvek, který začíná na řádku 13 souboru App.vue pátým znakem, nemá zavírací tag. Zprávy překladače Vue, tedy části Vue, která čte vaše soubory, jsou anglicky; tahle znamená „prvku chybí zavírací tag“. Opravte chybu a klikněte znovu na Spustit.

Chyby za běhu aplikace se ukážou v konzoli pod náhledem, stejně jako v kurzu JavaScriptu. Kromě chyb do ní Vue píše i varování, která začínají [Vue warn]:. Po varování aplikace běží dál, ale něco není v pořádku. Nejčastější varování říká, že šablona používá název, který skript nemá:

[Vue warn]: Property "cena" was accessed during render but is not defined on instance.
  at <App>

Znamená to, že šablona použila cena, když se stránka vykreslovala (anglicky render), ale komponenta nic takového nemá. Poslední řádek říká, ve které komponentě se to stalo, tady v App. Obvykle jde o překlep, v šabloně nebo ve skriptu, a stránka na místě názvu neukáže nic.

Chyba ve funkci řekne soubor a řádek, hned za názvem funkce:

ReferenceError: celkem is not defined
    at pridejDoObjednavky (App.vue:9)

Před ni Vue napíše vlastní varování, [Vue warn]: Unhandled error during execution of native event handler: ve funkci, kterou spustila událost, nastala chyba. Čtěte chybu pod varováním, ta říká, co se pokazilo.

Než začnete, vyzkoušejte si první druh chyby: v šabloně smažte </h1> za nadpisem a klikněte na Spustit. Přečtěte si zprávu pod náhledem a pak </h1> vraťte zpátky.