vue-loaderのScoped CSSには、1つ辛い点がある。それは、スタイルが子コンポーネントのルート要素に効いてしまうことである。だから、意図せず子コンポーネントのスタイルを崩してしまう危険性がある。 次のような場合、page.vueの.containerのスタイルは、page-header.vueの<div class="container">...</div>にも効いてしまう。 <template> <div class="container"> <page-header date="2017-12-07" heading="Hello!" /> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> </div> </template> <script> import PageHeader from '.