Display different Vuejs components for mobile browsers : <p>I am developing an SPA using Vue 2.0. The components developed so far are for the "desktop" browsers, for example, I have</p>

<p>Main.vue,
ProductList.vue,
ProductDetail.vue,</p>

<p>I want another set of components for the mobile browsers, such as
MainMobile.vue,
ProductListMobile.vue,
ProductDetailMobile.vue,</p>

<p>My question is, where and how do I make my SPA render the mobile version of components when viewing in a mobile browser?</p>

<p>Please note that I explicitly want to <strong>avoid</strong> making my components responsive. I want to keep two separate versions of them.</p>

<p>Thanks,  </p>
