あるSEのつぶやき・改

ITやシステム開発などの技術に関する話題を、取り上げたりしています。

Fix:Error: The selector "app-root" did not match any elements

Angular

Angular でなにも変更してないと思っていたのですが、突然、以下のようなエラーが発生するようになりました。

Error: The selector "app-root" did not match any elements
    at DefaultDomRenderer2.push../node_modules/@angular/platform-browser/fesm5/platform-browser.js.DefaultDomRenderer2.selectRootElement (platform-browser.js:1068)
    at DebugRenderer2.push../node_modules/@angular/core/fesm5/core.js.DebugRenderer2.selectRootElement (core.js:20533)
    at createElement (core.js:17195)
    at createViewNodes (core.js:19433)
    at createRootView (core.js:19386)
    at callWithDebugContext (core.js:20418)
    at Object.debugCreateRootView [as createRootView] (core.js:19904)
    at ComponentFactory_.push../node_modules/@angular/core/fesm5/core.js.ComponentFactory_.create (core.js:17725)
    at ComponentFactoryBoundToModule.push../node_modules/@angular/core/fesm5/core.js.ComponentFactoryBoundToModule.create (core.js:7464)
    at ApplicationRef.push../node_modules/@angular/core/fesm5/core.js.ApplicationRef.bootstrap (core.js:14546)

これ、手がかりがまったくなくて検索してもそれらしい解決策がなかったのですが、原因は、HTML の構文エラーでした。

以下がエラーになったものですが、の終了タグが抜けていますね。

<!--before-->
<html>
<body>
  <app-root></app-root>
</html>

<body>の終了タグを追加したところ問題は解決しました。

<!--after-->
<html>
<body>
  <app-root></app-root>
</body>
</html>

単純なエラーですが、まったく手がかりがないと見つけるのは困難ですね。