【Aurelia】todoアプリ作ってたらsystem.js:4 Uncaught (in promise) Error: (SystemJS) Error: Template markup must be wrapped in a <template> element e.g. <template> <!-- markup here --> </template>(…)が出たら確かめること
こういうことらしいので、aurelia触っていたんです
![https://aurelia.io/hub.html#/doc/article/aurelia/framework/latest/quick-start/1](https://kenjimorita.jp/wp-content/uploads/2016/08/5ce114a63325b60bd9388e5c19f7fe1c-1024x433.png)
Aureliaのtodoアプリ
https://aurelia.io/hub.html#/doc/article/aurelia/framework/latest/quick-start/1をやっていたのですが、
renderの際、ブラウザコンソールに
system.js:4 Uncaught (in promise) Error: (SystemJS) Error: Template markup must be wrapped in a <template> element e.g. <template> <!-- markup here --> </template>
こういうのでて、大変でした。
![system.js:4 Uncaught (in promise) Error: (SystemJS) Error: Template markup must be wrapped in a <template> element e.g. <template> <!-- markup here --> </template>](https://kenjimorita.jp/wp-content/uploads/2016/08/51c8e2200975c9d8b7c165405490e6b7.png)
やること
独自タグ書いているところを確認
![system.js:4 Uncaught (in promise) Error: (SystemJS) Error: Template markup must be wrapped in a <template> element e.g. <template> <!-- markup here --> </template>](https://kenjimorita.jp/wp-content/uploads/2016/08/61ee48dee100e92bceb07e42ce96139a.png)
自分は上のような階層でそのように書いていたのです。。多分笑われる。。
index.htmlとは別にsrc/app.htmlを作って、その中に
[code language="javascript"]
<template>
<h1>${heading}</h1>
</template>
[/code]
を書くべきだったようです。
なので最終的には
![<template> <h1>${heading}</h1> </template>](https://kenjimorita.jp/wp-content/uploads/2016/08/e247275029a7d953800ac10a9138f74c.png)
こう
再起動して
![<template> <h1>${heading}</h1> </template>](https://kenjimorita.jp/wp-content/uploads/2016/08/59fb329d6ff369658cf01f8161edb758.png)
うまく表示されました
ではーーー
【 関連記事 】
【REACT】REACTの動きを理解したい人の為の最小サンプル
【REACT入門】過去のREACT初心者の自分にREACTのPROPSとSTATEの違いを簡単に説明してあげたい
【REACT × ES6 × FLUX】を手っ取り早く学びたい人の為にサンプル作ったよ【3の倍数と3が付くときだけ猫になるCOUNTER】